0

我有一个稍微修改的 JSFiddle 来支持我的生产 JQuery 版本（1.10.1，原始版本使用 1.4.3）。<p>单击“添加新输入框”后，我无法获得“删除”链接来删除新创建的链接。我认为问题出在

$(this).parents('p').remove();

修改版：http: //jsfiddle.net/x68jx/

原始版本：http: //jsfiddle.net/jaredwilli/tZPg4/4/

4

2 回答 2

2

对于动态添加的元素，您必须使用事件委托。并且 id 应该是唯一的，所以请改用 class。

$(function() {
        var scntDiv = $('#p_scents');
        var i = $('#p_scents p').size() + 1;

        $('#addScnt').click(function() {
                $('<p><label for="p_scnts"><input type="text" id="p_scnt" size="20" name="p_scnt_' + i +'" value="" placeholder="Input Value" /></label> <a href="#" class="remScnt">Remove</a></p>').appendTo(scntDiv);
                i++;
                return false;
        });

        scntDiv.on('click', '.remScnt', function() { 
                if( i > 2 ) {
                        $(this).parents('p').remove();
                        i--;
                }
                return false;
        });
});

工作演示。

于 2014-05-28T01:40:58.693 回答
1

使用事件委托，因为标签是动态添加的：

scntDiv.on("click", ".remScnt", function() { 
    if( i > 2 ) {
        $(this).parents('p').remove();
        i--;
    }
    return false;
});

此外，正如@xdazz 所提到的，您应该不惜一切代价避免重复 ID。改用一个类。

http://jsfiddle.net/x68jx/4/

于 2014-05-28T01:40:52.873 回答