1. 程式人生 > >jquery動態新增刪除元素

jquery動態新增刪除元素

程式碼如下:

script type="text/javascript">
$(document).ready(function(){
	bindListener()
    $("#addButton").bind("click",function(){
        var msg = "<li><a href='javascript:void(0)'>刪我</a><span style='color:yellow;'></span><a name='del'>del</a></li>";
        $("#colist").append(msg);
        bindListener();
    });

    function bindListener(){
        $("#colist li a[name=del]").unbind().click(function(){
          $(this).parent().remove();
        });
    }

})
</script>
 
   <div id="nav">
        <ul id="colist">
        <li><a href='javascript:void(0)'>刪我</a><span style='color:yellow;'></span><a name='del'>del</a></li>
        </ul>
    </div>

    <input type="button" value="增加" id="addButton" />