Question

我正在努力改进以下脚本：

$(document).click(function(event) {
    $('.home.active').click();
    $('.home').removeClass("active");
});

这样可行，但是当我不希望它工作时它会起作用。例如，我有一个文本框。如果该文本框获得焦点，则不应删除该类，但如果单击页面上的任何其他内容，则应删除该类。所以我尝试了以下方法，但这不起作用：

$(document).click(function(event) {
    if( $('#txtHomeSearch').focus() ) {
        // don't remove class
    } else {
        $('.home.active').click();
        $('.home').removeClass("active");
    }
});

无论我在哪里点击，这都会完全停止正在删除的类，并且文本框始终具有焦点。

Answer 1

您可以使用event.target来确定点击元素的id：

$(document).click(function(event) {
    if (event.target.id === "txtHomeSearch") {
        // Don't remove class.
    } else {
        $('.home.active').click();
        $('.home').removeClass("active");
    }
});

Answer 2

使用

$(document).click(function(event) {
    if( event.target.id == 'txtHomeSearch' )
        return;

    $('.home.active').click();
    $('.home').removeClass("active");

});

无论$('.home.active').click();做什么，都可能搞砸了。

Answer 3

您可以使用target属性找到事件的来源。

if ($(event.target).prop('id') == 'txtHomeSearch') {
   //don't remove class
 }

Answer 4

你可以试试。您可能需要从#中删除#txtHomeSearch我不记得了。

$(document).click(function(event) {
    if( $(this).attr('id') == '#txtHomeSearch') {
        // don't remove class
    } else {
        $('.home.active').click();
        $('.home').removeClass("active");
    }
});

Answer 5

您可以使用event.target属性来交叉检查元素。问题是你的if( $('#txtHomeSearch').focus() ) ...没有检查它是否是焦点，它的焦点是它的焦点。

选择一个可以使用jquery（1.6）:focus选择器的焦点元素，使用$(document.activeElement)以供将来参考

除非单击某个文本框，否则单击任意位置删除类

5 个答案: