单击列表中的事件按钮不起作用

时间:2010-02-16 06:20:18

标签: jquery-ui

<ul id="mylist">
<li id="1">1<button id="Button3">Delete</button> </li>    
<li id="2">2<button id="Button2">Delete</button></li>
<li id="3">3<button id="another_entry">Save</button></li> 
</ul>

我的代码如下:

<script type="text/javascript">
             $(document).ready(function() {
             $("#mylist :button").live('click', function() {

                     var text = $(this).text();
                     if (text == "Delete") {
                         $(this).parent().remove();
                     }
                     else {
                         $(this).text("Delete");
                     }
                 });

                 $("#mylist li:last-child button").live('click', function() {
                 $(this).parent().append('<li>' + '<input type = "textbox">' + '<input type = "button" value= "Save">' + '</li>');

                 });
             });
                </script>

单击最后一个列表上的按钮,它不会添加新列表,保存按钮上的文本也不会更改为删除

1 个答案:

答案 0 :(得分:0)

您必须将新创建的li附加到ul,而不是button的父li

将代码更改为

$(this).closest("#mylist").append('<li><input type = "textbox" /><button>Save</button></li>');