通过点击事件获取相应数据的id,将id传到的控制器，根据id执行删除的sql语句，执行官删除；同时ajax的有点就是快捷方便，无刷新，增强用户的体验。
<?php

namespace app\index\controller;

use think\Controller;

use think\Db;

use think\Request;

class Del extends Controller

{

    //展示数据

    public function show(){

        $data = Db::table('yun')->select();

        return view("show",['data'=>$data]);

    }

    //删除

    public function del(){

        $id = Request::instance()->param("id");

        return Db::table('yun')->where('id',$id)->delete();

    }

}
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>ajax删除</title>

</head>

<body>

<center>

    <table>

        <tr>

            <td>ID</td>

            <td>姓名</td>

            <td>年龄</td>

            <td>地址</td>

            <td>操作</td>

        </tr>

        {volist name="data" id="vo"}

        <tr class="{$vo.id}">

            <td>{$vo.id}</td>

            <td>{$vo.name}</td>

            <td>{$vo.age}</td>

            <td>{$vo.address}</td>

            <td>

                <button type="button" class="del" id="{$vo.id}">删除</button>

            </td>

        </tr>

        {/volist}

    </table>

</center>

</body>

</html>

<script src="/static/js/jquery.js"></script>

<script>

    $(".del").click(function(){

        var id = $(this).attr("id");

        $.ajax({

            method:"POST",

            url:"{:url('del/del')}?id="+id

        }).done(function(d){

            if(d==){

                $("."+id).remove();

                alert("删除成功");

            }else{

                alert("删除失败");

            }

        });

    });

</script>

ajax单删的更多相关文章

  1. ajax全选、全不选、反选、单删/批删

    <meta charset="utf-8"> <?php //链接数据库 $link = mysqli_connect('127.0.0.1','root','r ...

  2. jquery中的全选、反选、全不选和单删、批删

    HTML页面 <!doctype html><html lang="en"><head> <meta charset="UTF- ...

  3. TP5中即点即改，json分页，单删

    HTML页面: <!doctype html><html lang="en"><head> <meta charset="UTF ...

  4. 利用 html的锚点（元素a）功能实现ajax单页面应用的浏览器后退前进功能

    一.问题 随着AJax技术的普及,单页面web程序的应用越来越广泛. 所谓单页面应用程序,简单的说,就是应用只有一个主网页,第一次加载后,后续页面只会利用js和ajax到服务器获取数据进行页面的局部刷 ...

  5. django ajax增 删 改 查

    具于django ajax实现增 删 改 查功能 代码示例: 代码: urls.py from django.conf.urls import url from django.contrib impo ...

  6. laravel 7 H-ui模板ajax批删

    1,HTML页面写一个button按钮 <a href="javascript:;" onclick="deleteAll()" class=" ...

  7. tp5 ajax单文件上传

    HTML代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...

  8. ajax批删

  9. js正则、js全选、反选、全不选、ajax批删

    <button onclick="fun1()">全选</button><button onclick="fun2()">全 ...

随机推荐

  1. java面向对象编程(四)--类变量、类方法

    1.什么是类变量? 类变量是该类的所有对象共享的变量,任何一个该类的对象去访问它时,取到的都是相同的值,同样任何一个该类的对象去修改它时,修改的也是同一个变量. 如何定义类变量? 定义语法:     ...

  2. aps.net国际化本地资源 .resources”正确嵌入或链接到程序集

    asp.net国际化提供了资源文件的解决的方式, asp.net自带的两个项目文件夹 分别是:App_GlobalResources和App_LocalResources, App_GlobalRes ...

  3. enctype="multipart/form-data"表单传值问题

    问题: form表单的enctype设置为multipart/form-data后,表单中除了文件后台能拿到,其他值后台都拿不到. 知识点: 一.application/x-www-form-urle ...

  4. web（七）css的语法规则、注释

    css的语法规则:特殊的css语法标识. !important:当使用多种方式设定标签样式时,设定样式渲染的应用优先权,声明在取值之后. .important { color: red !import ...

  5. I think I need a boat house

    I think I need a boat house. Fred Mapper is considering purchasing some land in Louisiana to build h ...

  6. 基于tensorflow的简单线性回归模型

    #!/usr/local/bin/python3 ##ljj [1] ##linear regression model import tensorflow as tf import matplotl ...

  7. cordova日期插件的使用：cordova-plugin-datepicker

    1. 添加插件:cordova plugin add cordova-plugin-datepicker; 2.插件的主体样式设置: 3.以上5中样式的截图: THEME_TRADITIONAL的样式 ...

  8. java 中Math 的常用方法

    public class Demo{ public static void main(String args[]){ /** *Math.sqrt()//计算平方根 *Math.cbrt()//计算立 ...

  9. js中常用的内置对象

    Arguments 函数参数集合 arguments[ ] 函数参数的数组 Arguments 一个函数的参数和其他属性 Arguments.callee 当前正在运行的函数     Argument ...

  10. Mathematics for Computer Science (Eric Lehman / F Thomson Leighton / Albert R Meyer 著)

    I Proofs1 What is a Proof?2 The Well Ordering Principle3 Logical Formulas4 Mathematical Data Types5 ...