Question

我有这个示例代码：

$myTrigger
    .click(function(e){
         alert('click');
    })
    .focus(function(e){
         alert('focus');
         $(this).click()
    })

目的是当我点击$ myTrigger时我希望发生一些事情。另一方面，如果你通过键盘选中它（即焦点），我想要完全相同的事情发生，所以我要求它点击。

如果我点击它，它也会集中注意力。所以这两个警报都会消失。

有没有办法阻止焦点事件在点击时消失？

更新：

Ajm的评论让我觉得我可能会问错误。

问题：点击事件是否总是在javascript（和/或jQuery？）中引发焦点。我可以假设，无论何时我想要同时处理用鼠标点击并使用键盘进行制表操作，focus（）事件都会同时处理这两种情况吗？

或者它是否依赖于我将事件附加到的特定元素？（在这种情况下，$ myObject恰好是一个锚标记（链接）。

Answer 1

jQuery有一个内置函数，它没有被使用，通常被称为.one()

$mytrigger.one('click focus', function() { alert("event"); });

这只会触发一次，或者你可以在之后再重新绑定。

Answer 2

要触发TAB焦点的click（）（并且当鼠标点击焦点时阻止click（）被触发两次），我执行了以下操作：

$('#item').mousedown(function(){
    $(this).data("mouseDown", true);
});

$('#item').mouseup(function(){
    $(this).removeData("mouseDown");
});

$('#item').focus(function(){
    if (!$(this).data("mouseDown"))
        $(this).click();
});

这对你有用吗？

Answer 3

另一种选择是：

$myTrigger
    .mousedown(function(e) {
        e.preventDefault();  // don't grab focus
    })
    .click(function(e) {
         alert('click');
    })
    .focus(function(e) {
         alert('focus');
         $(this).click()
    });

这将使键盘在任何地方点击按钮之前保持焦点，同时仍然允许按钮通过Tab聚焦（或以编程方式调用.focus()）。

Answer 4

一段时间我遇到了类似的问题。我 solved it 通过响应第一个事件，并忽略下一个20毫秒的事件。

尝试这样的事情：

$(document).ready(OnReady);

var okToClick = true;

function OnReady() {
    //Attach to both click and focus events
    $("#item").click(PerformAction).focus(PerformAction);
}

function PerformAction() {
    if (okToClick) {
        okToClick = false;

        // Do something interesting here...

        setTimeout(function() { okToClick = true; }, 20);
    }
}

Answer 5

您只能使用 focus（）方法，并阅读有关JavaScript上的事件（e）类型的文章：http://www.quirksmode.org/js/events_properties.html

要检测您使用鼠标或键盘进行的事件（进行测试），您可以使用：

if (!e) var e = window.event;
alert(e.type);

Answer 6

为防止焦点被调用两次，请设置一个变量来判断该元素是否具有焦点。

var hasFocus = false;
$('#myTrigger').focusIn(
   function(){
      hasFocus = true;
      //do stuff
   }
);

$('#myTrigger').focusOut(
   function(){
      hasFocus = false;
   }
);

将所有功能放在焦点上，并告诉jQuery在点击元素时设置元素，如果你遇到不这样做的浏览器。

$(#myTrigger).click( function(){ if(!hasFocus){$(#myTrigger).focus()}});

jquery触发焦点或点击操作，但不是两者

6 个答案: