Question

我是jQuery的初学者，我添加了一个jQuery，以使某些div元素在视图中保持可见，而其他div元素在按钮焦点移开时（在元素外部单击）隐藏。但是，当您单击该按钮时，会看到“显示”元素。如何防止这种情况发生？我尝试了.mousedown return default的操作，但是没有运气。

$(".table-btn").focusout(function() {
            $("#pricelist0").show();
            $("#pricelist1, #pricelist2").hide();
    })

修改：
我创建了fiddle以使问题更明显，因此，当您单击另一个按钮时，出现pricelist0。

其他：
使用给定的答案，并且在单击某些元素时不松开按钮的焦点，您可以另外添加以下代码。任何元素都是您希望按钮保持焦点的元素。

var lastFocus;
    $("any element").mousedown(function(e) {
    return false;
    });    
    $(".table-btn").blur(function() {
        lastFocus = this;
    });

Answer 1

单击#pricelist1或#pricelist2会触发focusout的另一个按钮，这就是显示#pricelist0的原因。

尝试一下；

$(document).on("click", ":not(.table-btn)", function(e){
    if(e.target !== this)
        return;

    $("#pricelist0").show();
    $("#pricelist1, #pricelist2").hide();
});
$("#1").click(function(){
    $("#pricelist1").show();
    $("#pricelist2, #pricelist0").hide();
});
$("#2").click(function(e){
    $("#pricelist2").show();
    $("#pricelist1, #pricelist0").hide();
});

如何防止焦点事件中的mousedown事件？

1 个答案: