标签:dde click pos one oda 方法 rev app lse
应用场景:
用户点击功能,JavaScript动态生成DOM树,然后用户点击删除,删除成功后,刷新该页面
思路:
将要发送的Ajax用一个函数存起来
然后,当用户点击时,执行该函数,然后生成该DOM树,
再然后,当用户点击该页面上的删除按钮时,发送一个删除命令的Ajax请求,删除完成后,再次调用该函数,请求数据,完成刷新需求。
function navlist(){ $("#content").html( "<table class=‘table table-border table-bordered table-hover tablelook‘><tbody><tr><th>标题</th><th>图标</th><th>网址</th><th>文字</th><th>操作</th></tr></tbody></table>" ); $.ajax({ type: "get", url: "/nav/u/navlist", dataType: "json", success: function (response) { var datajs = response.data; for (let index = 0; index < datajs.length; index++) { $(".tablelook").append( "<tr>" + "<td>" + datajs[index].title + "</td>" + "<td><img style=‘width:20px‘ src=" + datajs[index].img + "></td>" + "<td><p style=‘overflow: hidden;‘>" + datajs[index].href + "</p></td>" + "<td>" + datajs[index].alt + "</td>" + "<td>" + "<a href=‘javascript:;‘ data_id=‘" + datajs[index].id + "‘>改</a>" + "<span> | </span>" + "<a href=‘javascript:;‘ data_id=‘" + datajs[index].id + "‘>删</a>" + "</td>" + "</tr>" ); } $(".tablelook a:odd").click(function (e) { e.preventDefault(); tan(‘提示!‘, ‘我要删除了噢~‘); $(".modal-footer .btn").click(function () { $.ajax({ type: "post", url: "/nav/u/del", data: "id=" + $(".tablelook a:odd").attr(‘data_id‘), dataType: "json", success: function (response) { if (response.state) { info(‘删除成功!‘); navlist(); } else { info(‘删除失败‘); } } }); }); }); } }); } $("#btn_adminc").click(function (e) { e.preventDefault(); navlist(); });
标签:dde click pos one oda 方法 rev app lse
原文地址:https://www.cnblogs.com/xfstu/p/12635333.html