如何在jquery中删除先前的绑定事件

On a checkbox change event, one of a javascript bind the toggle action.

在复选框更改事件中，一个javascript绑定切换操作。

Later on(in a different script) I want to change toggle action based on a condition.

稍后(在另一个脚本中)，我想根据条件更改切换动作。

Ex. script 1:

例如脚本1:

$(document).ready(function () {
    var shipFields = $('.address1 input');

    $("input[name = 'same_as_bill']").on("change", function (evt) {
        toggleFields(shipFields, !$(this).is(":checked"));
    });

   function toggleFields(fields, show) {
        var inputFields = $("li", fields).not(".sameas, .triggerWrap");
        inputFields.toggle(show);
    }
}

Script 2:

脚本2:

$(document).ready(function () {

    $('li.sameas input').click(function (sender) {

          var target = $(sender.target);
          var selectedCountryValue = $('li.country select', target.closest('fieldset')).val();

          // determine data method based on country selected
          if (selectedCountryValue === "xxx") {
              ShowAddress(true, target);
          } else {
             ShowAddress(false, target);
          }
    });

    function kleberShowAddress(show, target) {
          if (show) {
               $('li.address).hide();
          } else {
               $('li.address).show();
          }
     }
});

Issue I have here is, my site load the script 1 first and then the script 2. So by the time script 2 performs the action, toggle action is queued and will trigger that after the changes from script 2, that will revert the changes which I want.

这里的问题是，我的站点先加载脚本1，然后加载脚本2。因此，当脚本2执行该操作时，切换操作将被排队并在脚本2的更改之后触发，这将恢复我想要的更改。

Is there a way to remove the action in the queue? or stop happening first request. I do not want to use .unbind() which will stop triggering script 1 function. I just want to stop the action when ever it meets the condition in script 2.

是否有方法删除队列中的操作?或者停止第一个请求。我不想使用.unbind()，它将停止触发脚本1函数。我只想在满足脚本2中的条件时停止操作。

Please note: above functions are trimmed to show less codes.

请注意:上面的功能被削减以显示更少的代码。

1 个解决方案

#1

add var isActive = true; and use it to check in first script. In script 2, you can call isActive = false any time you want to disable the first script's function or isActive = true for re-enable them.

添加var isActive = true;并使用它来检查第一个脚本。在脚本2中，您可以随时调用isActive = false来禁用第一个脚本的函数，或者isActive = true来重新启用它们。

Your code will look like:

您的代码将如下所示:

//script1    
var isActive = true;
$(document).ready(function() {
    var shipFields = $('.address1 input');

    $("input[name = 'same_as_bill']").on("change", function(evt) {
        if (isActive) {
            toggleFields(shipFields, !$(this).is(":checked"));
        }
    });

    function toggleFields(fields, show) {
        if (isActive) {
            var inputFields = $("li", fields).not(".sameas, .triggerWrap");
            inputFields.toggle(show);
        }
    }
});

//script2
$(document).ready(function() {
    isActive = false;

    $('li.sameas input').click(function(sender) {

        var target = $(sender.target);
        var selectedCountryValue = $('li.country select', target.closest('fieldset')).val();

        // determine data method based on country selected
        if (selectedCountryValue === "xxx") {
            ShowAddress(true, target);
        } else {
            ShowAddress(false, target);
        }
    });

    function kleberShowAddress(show, target) {
        if (show) {
            $('li.address').hide();
        } else {
            $('li.address').show();
        }
    }
});