javascript - jquery : Can I return back to same click event after user clicks on another element?

Question

我的要求是交换到周围的小部件。第一次用户单击小部件 A header 时，我可以将本地信息/数据存储在某处(即“用户单击 widgetId=A”)，现在我等待用户单击另一个小部件 header 小部件 B。

一旦控制权传回原始函数，现在我有了关于 Widget B id 的信息，我可以交换它。

<div>
<div class="widget header" id="WidgetA"> .... </div>
<div class="widget header" id="WidgetC"> .... </div>
<div class="widget header" id="WidgetB"> .... </div>
</div>

几周前我在 stackoverflow 上看到了一段 jquery 代码，它将控制发送回之前的点击事件，但从那以后我一直在搜索它，但找不到任何地方。

类似 -

$(..).on("click", function() {
   // some more code
    $(..).XXX("xxx", function(){
          //on second click code flows directly here...
    });

});

Answer 1

“返回到先前的点击事件”并不容易/不可能 - 相反，定义一个函数来检查这两个事件是否都发生了，一些，例如:

var widgetAclicked = false;
var widgetBclicked = false;

$("#WidgetA").click(function() { widgetAclicked = true; process(); }
$("#WidgetB").click(function() { widgetBclicked = true; process(); }

function process() {
    if (!widgetAclicked) return;
    if (!widgetBclicked) return;

    // process when both clicked
}

如果您不想为此使用 var，您可以存储在小部件本身上，例如:

$("#WidgetA,#WidgetB").click(function { 
    $(this).data("beenclicked", true);
    process();
});

function process() {
    if ($("#WidgetA").data("beenclicked") != true 
            || $("#WidgetB").data("beenclicked") != true)
        return;
    // process
}

这也使得添加/删除小部件变得更加容易，而无需任何额外的代码:

// apply to all widgets
$(".widget").click(function { 
    $(this).data("beenclicked", true);
    process();
});

然后您的 process() 可以检查哪些已被点击，以进行所需的恶意处理。