Question

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

我附加了特定于元素的命名空间来分隔ajaxComplete处理程序，但这还没有解决问题。我可能错过了或者没有使用明显的东西。

正如我所看到的，主要问题是我根据点击的最后一个按钮存储ID，因此当事件被触发时，它会影响错误的元素。（分配给$sheetBlock的最新变量）。我需要在点击与事件对应的按钮时存储这些变量。

一些警告 - 我无法为html元素添加任何额外属性，但是，受影响的每个按钮和元素都有自己的ID。

我认为将$flippyFunc函数存储在var中并在按下每个按钮时运行将允许我在每个按钮旁边存储每个按钮的ID，以便一起使用每个ajax事件。我怎么能这样做？

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事件触发时使用

1 个答案: