单击按钮时存储变量，以便在 ajaxComplete 事件触发时使用

Question

我在一个页面上有 4 个相同的按钮 class。单击这些按钮中的任何一个时，都会触发 Ajax 事件，我用 ajaxComplete 监听该事件。问题是，如果我一个接一个地点击一个按钮，分配给第一个的变量似乎会覆盖第二个，所以第二个的动作不会发生。

我附加了特定于元素的命名空间以分隔 ajax完整的处理程序，但这并没有解决问题。我可能遗漏了或没有使用明显的东西。

在我看来，主要问题是我存储的是基于最后单击的按钮的 ID，因此当事件被触发时，它会影响错误的元素。（分配给 $sheetBlock 的最新变量）。我需要在单击事件对应的按钮时存储这些变量。

一些注意事项——我不能向 html 元素添加任何额外的属性，但是，每个受影响的按钮和元素都有自己的 ID。

我认为在按下每个按钮时将 $flippyFunc 函数存储在 var 中并运行将允许我在每个 [=] 旁边单击时存储每个按钮的 ID 25=] 一起使用的事件。我该怎么做？

var $id = null;
var $laddaButtons = [];
var $it = null;
var $results = [];
var $sheetBlock = [];

var runOnAjax = function(button, id){
    $(button).off('mousedown.button');
    $sheetBlock[id] = $('#'+button.parentNode.parentNode.parentNode.parentNode.id);
};
var $flippyFunc = function($id){
    $sheetBlock[$id].flippy({
    //options
    });
};

$('.ladda-button').on('mousedown.this', function(e) {
    $id = this.id;
    $it = this;
    runOnAjax($it, $id);
    $(document).on("ajaxComplete."+$id, function(e) {
        $(document).off("ajaxComplete."+$id);
        $flippyFunc($id);       
    });
});

Answer 1

我能够将我需要的变量从 ajaxSend 事件的设置对象传递到相应的 ajaxComplete 事件的设置对象。很简单：

$(document).on("ajaxSend"), function(e, xhr, settings) {
    settings.buttonID = $id;
}

然后在触发相应的 ajaxComplete 事件时访问 buttonID 变量：

$(document).on("ajaxComplete"), function(e, xhr, settings) {
    $id = settings.buttonID;

    // Now I can use `$id` as it was when the ajaxSend event was triggered.
}

单击按钮时存储变量，以便在 ajaxComplete 事件触发时使用

Store variable at the time button is clicked for use when ajaxComplete event fires

javascript

ajax

jquery

event-handling

jquery-events