上一篇: 更改类后的jQuery id和类选择器下一篇:jQuery单击功能,等待它再次启动之...

为什么jQuery不能删除动态添加行的工作？

jQuery 发布时间：2022-04-19 发布网站：大佬教程 code.js-code.com

大佬教程收集整理的这篇文章主要介绍了为什么jQuery不能删除动态添加行的工作？，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

我是jQuery的新手.

你们知道为什么.remove()对使用add按钮添加的行不起作用吗？它适用于已有的元素,例如< li> One< / li>.

<html>
<head>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $('.more').click(function(){
                html_frag='<li>XXX<input type="submit" value="Remove" class="tesTing" /></li>';
                $('ul li:last').after(html_frag);
                return @R_197_11372@se;
            });
        });

        $(document).ready(function(){
            $('.tesTing').click(function(){
                $(this).remove();
                return @R_197_11372@se;
            });
        });
    </script>
</head>
<body>
    <ul>
        <li>
            One
            <input type="submit" value="Remove" class="tesTing" />
        </li>
    </ul>
    <input type="submit" value="Add" class="more" />
</body>
</html>

解决方法

因为绑定该处理程序时,DOM上不存在新添加的元素.尝试使用如下的委托事件,

$(document).ready(function(){
        $(document).on('click','.tesTing',function(){
            $(this).remove();
            return @R_197_11372@se;
        });
 });