添加 - 删除功能 delegate 事件
- <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
- <html>
- <head>
- <title>
- Title
- </title>
- <meta charset="UTF-8" />
- </head>
- <body>
- <input id="a1" type="text" />
- <input id="a2" type="button" value="添加" />
- <input id='b' type="button" value="删除" />
- <ui id="u">
- <li>
- 1
- </li>
- <li>
- 2
- </li>
- </ui>
- <script src="jquery-1.12.4.js">
- </script>
- <script>
- //delegate比较重要---委托
- $('#a2').click(function() {
- var t = $('#a1').val() var l = ' < li > ' + t + ' < /li>'
- $('#u').append(l)
- })
- $('ui').delegate('li', 'click', function () {
- var a = $(this).text();
- alert(a);
- })
- $('#b').click(function () {
- var index = $('#a1').val()
- $('#u li').eq(index).remove()
- })
- /
- </script>
- </body>
- </html>
来源: http://www.bubuko.com/infodetail-1864724.html