ajax 销毁,删除功能（Ajax版）

单个删除

删除按钮：

var delBtn = $("删除");

注意：

//此事件不可用

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

var id =$(this).parents("tr").find("td:eq(1)").text();

alert(id);

});

上面这段代码不起作用的。因为，删除按钮是用DOM动态生成。

DOM生成的UI，需要如下代码绑定事件。

//单个删除事件

$(document).on("click", ".del", function () {

var id = $(this).parents("tr").find("td:eq(1)").text();

if (confirm("确定删除" + id + "吗？")) {

$.ajax({

url: "${ctx}/emp/" + id,

type: "delete",

success: function (result) {

if (result.code == 100) {

alert(result.msg);

//删除后跳转到当前页面

toPage(currentPage);

}

}

});

}

});

全选/全不选

与之前的写法一样

//全选/全不选

$("#checkAll").click(function () {

$(".checkItem").prop("checked", $(this).prop("checked"));

//这里不能用attr

});

$(document).on("click", ".checkItem", function () {

var flag = $(".checkItem:checked").length == $(".checkItem").length;

$("#checkAll").prop("checked", flag);

//这里不能用attr，只能用prop

});

批量删除

//批量删除事件

$("#batchDel").click(function () {

var ids = ""; //保存拼接id

var count = 0; //统计选中个数

$.each($(".checkItem:checked"), function (index, item) {

ids += item.value + ",";

count++;

});

if (count == 0) {

alert("请选中要删除的记录");

return false;

}

ids = ids.substring(0, ids.length - 1);

if (confirm("确定删除" + ids + "吗？")) {

$.ajax({

url: "${ctx}/emp/" + ids,

type: "delete",

success: function (result) {

if (result.code == 100) {

alert(result.msg);

//删除后跳转到当前页面

toPage(currentPage);

//全选复选框变为全不选

$("#checkAll").prop("checked", false);

}

}

});

}

});

@ResponseBody

@RequestMapping(value="/emp/{ids}",method = RequestMethod.DELETE)

public Msg delete(@PathVariable String ids){

//批量删除

if(ids.contains(",")){

String[] arr = ids.split(",");

List list = new ArrayList<>();

for (String e : arr) {

Long id = Long.parseLong(e);

list.add(id);

}

empService.batchDel(list);

}

//单个删除

else{

Long id = Long.parseLong(ids);

empService.delele(id);

}

return Msg.success();

}