2

您好，我正在尝试编写此代码来为每个输入添加一个删除 btn，我通过 javascript 添加每个输入都没有问题：·

但是删除 btn 它根本不起作用，我想你会更快地看到我的错误，因为我真的是 javascript 的新手。希望你能帮我..

$(document).ready(function () {
    var i = $('.field').size() + 1;
    $('#add').click(function () {
        $('<div class="fieldss' + i + '"><label for="link' + i + '">Video/Link</label><input type="text" class="field' + i + '" name="link' + i + '" value="' + i + '" /><a href="#" id="remove' + i + '">Remove</a></div>').fadeIn('slow').appendTo('.inputs');
        i++
    });
    $('#remove' + i + '').click(function () {
        $('.fieldss' + i + '').remove();
        i--
    });
    $('#reset').click(function () {
        while (i > 2) {
            $('.field:last').remove();
            i--
        }
    });
    $('.submit').click(function () {
        var answers = [];
        $.each($('.field'), function () {
            answers.push($(this).val())
        });
        if (answers.length == 0) {
            answers = "none"
        }
        alert(answers);
        return false
    })
});

问题一定出在删除 btn 代码中，因为我不知道如何设置它...我曾经有过这样的设置，但是这删除了添加的最后一个项目，我需要为每个删除 btn。

 $('#reset').click(function () {
     while (i > 2) {
         $('.fieldss:last').remove();
         i--;
     }
 });
4

1 回答 1

0

由于您是动态添加它，因此您可以使用事件委托绑定事件到存在的父级。使用一个类remove将其添加到删除元素。您也可以使用<div class="fieldss">然后：-

$('#add')
        .click(function () {
        $('<div class="fieldss"><label for="link' + i + '">Video/Link</label><input type="text" class="field' + i + '" name="link' + i + '" value="' + i + '" /><a href="#" id="remove' + i + '" class="remove">Remove</a></div>')
            .fadeIn('slow')
            .appendTo('.inputs');
        i++;
    });

$(document).on('click','.remove', function() { 
// use a container selector instead of document.

   $(this).closest('.fieldss').remove();
});
于 2013-05-14T21:22:58.503 回答