0 
var filters_used = new Array();
$('#filter-text').keyup(function(k) {
    $('#error').html('');
    if (k.keyCode == 13) {
        $('#add-filter').click();
    }
});

function reg_remove() {
    $('.remove-filter').click(function() {
        console.debug("remove-filter.click()");
        var col = $(this).children('td:nth-child(2)').html();
        var index = $.inArray(col, filters_used);
        filters_used.splice(index, 1);
        $(this).parents('.filter').remove();
        return false;
    });
}

function check_value() {
    var flag = true;
    var value = $('#filter-text').val();
    var col = $('#filter-type').val();
    var reg = /[^0-9a-zA-Z\s\-]/;
    if (value.match(reg) || value.trim() === "") {
        flag = false;
        $('#error').html('Only letters, numbers, spaces, and dashes (-) are allowed.');
    } else if ($.inArray(col, filters_used) >= 0) {
        flag = false;
        $('#error').html('That column is already being filtered.');
    }
    return flag;
}
$('#add-filter').click(function() {
    if (check_value()) {
        var value = $('#filter-text').val();
        var col = $('#filter-type').val();
        $('#filter-text').val('');
        appendstr = '<tr class="filter"><td>' + value + '</td><td>' + col + '</td><td>' + '<a href="" class="remove-filter">Remove</a></td></tr>';
        $('#filter-form').after(appendstr);
        filters_used.push(col);
        reg_remove();
        //queryDB();
    }
});

function get_filters() {

}?

链接到包含我的代码的小提琴我
试图让用户创建一个过滤器列表，本质上。添加它们似乎工作正常，但是 remove() 函数仅在只有一个过滤器项时才能正常工作。如果您创建第一个，然后单击底部项目上的删除，该项目的 onclick() 函数将被调用两次，我终生无法弄清楚为什么。

4

2 回答 2

2

看不到小提琴正在运行，但您可能想从代码中更改

$('#add-filter').click(function() {

到

$('#add-filter').click(function(e) {
    e.preventDefault()

（与其他点击相同）

编辑：哦，现在我可以看到它正在运行。在我看来，实际问题是，当您添加“删除”链接时，您会重新绑定 click for .remove-filter （包括已经创建的链接）。相反，您只能使用.on一次，它适用于您拥有的所有元素以及您创建的任何新元素。就像是...

$('table').on("click", ".remove-filter", function() {
...

这样做一次document.ready，应该这样做（在添加“删除”链接后删除对 reg_remove 的调用）

PD.on适用于 jquery 1.7 及更高版本，如果您使用早期版本，您将使用.liveor.delegate来实现

于 2012-06-01T16:56:09.723 回答
0

是的，将框架更改为 jquery 以使您的小提琴工作..

发生的事情是你在每个条目上调用 .remove ，当你有多个删除按钮时，它会为每个创建的按钮调用 click （每次创建一个新的，你添加一个新的 click 事件到 .删除选择器...您需要这些是固有的。在创建时，添加一个仅记录该记录的匿名函数调用，您将不再遇到此问题

当您有 3 个删除按钮时，它会被调用 3 次，2 个按钮，两次，因为在每次添加时，您都会将另一个单击处理程序添加到列表中。

于 2012-06-01T17:08:26.713 回答