jQuery 1.10不删除动态生成的输入字段

Question

JsFiddle有一个很好的演示，但只适用于jquery 1.8。这是链接：http://jsfiddle.net/tZPg4/12409/

添加另一个输入框

    

             

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

    $('#addScnt').on('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="#" id="remScnt">Remove</a></p>').appendTo(scntDiv);
        i++;
        return false;
    });

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

1.9版本，它需要迁移1.1.0才能拥有＆＃34;删除＆＃34;按预期工作。

版本1.10及更高版本不会对.live和.on

都起作用

Answer 1

像这样修好......

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

        $('#addScnt').on('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="#" id="remScnt">Remove</a></p>').appendTo(scntDiv);
                i++;
                return false;
        });

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

Answer 2

以下是任何版本的jQuery的工作代码：

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

        $('#addScnt').on('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;
        });

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