##目的:给每一个<a>标签的删除按钮 添加一个点击事件,弹出对话框:是否要删除!
一:JSP 代码
<body> <s:a href="ex_list.action">2删除</s:a><br> <a href="ex_list.action">删除</a><br> <a href="#">删除</a><br> <a href="#" οnclick="delFunction()">删除</a><br> <a href="#">修改</a><br> <a href="#">新增</a><br> </body>
说明: 如果按以往的方式 是在 a 标签中,写一个 onclick() 事件: <a href="#" οnclick="delFunction()">删除</a>
整个项目就需要写很多次
二:通过JS 插件的方式 为每一个 文本内容叫“删除” 的a标签,条件事件
1 这里有两个JS 文件,一个是插件编写代码实现,一个是声名该插件,可以写在一起,但是分开写较好,方便维护
2.插件 JS
说明: 定义 一个 JS 函数
循环所有a 标签
如果a标签的文本值是:”删除“,绑定一个 click 方法,点击时候 出发时间,confirJson 是下一个JS 定义的时候传的参数。
(function(jQuery){ $.confirm = function(confirJson){ $("a").each(function(){ if($(this).text()=="删除"){ $(this).unbind("click"); $(this).bind("click",function(){ //confirJson.callback(); return window.confirm(confirJson.message); }); } }); } })(jQuery);
3 使用该插件 JS
$().ready(function(){ /** * 当页面进行加载的时候,给名称删除的超级连接添加一个事件 */ $.confirm({ message:"您确认是否要删除吗?", callback:function(){ alert("我就是牛"); } }); });
4 在JSP 页面 引入这两个JS 即可
5 发布项目,点击 删除 会弹出 确认框,点击 其他的 不会弹出提示框