Question

我对Jquery有一个小问题。我有一个有很多选择的表格。

在表单中，我可以将数据设为私有或公开;

将数据设为私有：是，否（单选按钮）
如果单击是，则显示一个隐藏的div，其中包含2个表单选项; 一个。会员名称搜索（文本输入）湾选定的成员（多选框）。

如果我点击将数据设为私有“是”，并搜索用户名，则会显示找到的结果，如建议框。当我点击用户名（在建议框中显示的一个找到的结果中）时，我可以将其成功添加到我的多选择框（选定的成员）

如果我决定公开并点击将一些成员添加到我的多选择框（选定成员）后将数据设为私有“否”，我将删除所有选项，并在其中添加1个选项（公共视图）

问题在这之后开始。在提交表单之前，如果我再次单击将数据设为私有“是”，（1;单击是，选择一些成员，2;单击否并从selectbox中删除所有选项，3;再次单击是），搜索某些成员和点击它们，它在我的多选框中添加了2次（选定的成员）。

有趣的是，如果我这样做2次（添加一些成员，单击no以获取隐私和删除选项），下次当我想添加一些成员时，它会添加2次。如果我这样做5次，则会增加5次。

我不知道是什么导致这种情况，如果有人能帮助我，我会很高兴。

这是我的Jquery;

// Private Options
$('input[name=make_private]').bind('click', function () {
    // Make It Private
    if ($(this).val() == 1) {
        $('.frm_make_private_1').fadeIn(1000);
        // Get clicked member
        $('a.member').live('click', function () {
            var username = $(this).text();
            var id = $(this).attr("id");
            // Add it to the Allowed Members Multi Selectbox
            $('#allowedMembers').append($("<option></option>").attr("value", id).text(username).attr("selected","selected"));
            // Don't load the page
            return false;
        });
    }
    // Make It Public
    else {
        // Hide everything about Product Privacy
        $('.frm_make_private_1').fadeOut(1000);
        // Remove All Options
        $("#allowedMembers option").each(function() {
            $(this).remove();
        });         
        // Add Public Option
        $('#allowedMembers').append($("<option></option>").attr("value", 0).text("Public View"));
    }
});

提前感谢您的时间和关注。

Answer 1

当你多次绑定事件时，你应该先.unbind()。否则，您将有多个（可能相同）事件绑定到同一个操作

尝试

('input[name=make_private]').unbind().bind('click', function () {
// Make It Private
if ($(this).val() == 1) {
    $('.frm_make_private_1').fadeIn(1000);
    // Get clicked member
    $('a.member').unbind().live('click', function () {
        var username = $(this).text();
        var id = $(this).attr("id");
        // Add it to the Allowed Members Multi Selectbox
        $('#allowedMembers').append($("<option></option>").attr("value", id).text(username).attr("selected","selected"));
        // Don't load the page
        return false;
    });
}
// Make It Public
else {
    // Hide everything about Product Privacy
    $('.frm_make_private_1').fadeOut(1000);
    // Remove All Options
    $("#allowedMembers option").each(function() {
        $(this).remove();
    });         
    // Add Public Option
    $('#allowedMembers').append($("<option></option>").attr("value", 0).text("Public View"));
}
});

Answer 2

找到方法，在$（'input [name = make_private]'）之外移动$（'a.member'）。live（'click'）。bind（'click'）完成了诀窍。谢谢Ron指导我。

// Private Options
$('input[name=make_private]').bind('click', function () {
    // Make It Private
    if ($(this).val() == 1) {
        $('.frm_make_private_1').fadeIn(1000);
    }
    // Make It Public
    else {
        // Hide everything about Product Privacy
        $('.frm_make_private_1').fadeOut(1000);
        // Remove All Options
        $("#allowedMembers option").each(function() {
            $(this).remove();
        });         
        // Add Public Option
        $('#allowedMembers').append($("<option></option>").attr("value", 0).text("Public View"));
    }
});
// Get clicked member
    $('a.member').live('click', function () {
        var username = $(this).text();
        var id = $(this).attr("id");
        // Add it to the Allowed Members Multi Selectbox
        $('#allowedMembers').append($("<option></option>").attr("value", id).text(username).attr("selected","selected"));
        // Don't load the page
        return false;
    });

Jquery表单问题。从选择框添加删除选项

2 个答案: