Question

在this post后我在jQuery或Firefox中发现了一个奇怪的错误。你能解释哪一个是对的。

jQuery(document).ready(function(){

    //Works on Windows in: Firefox(17.0.1), IE
    //Doesn't work on OS X 10.8 in: Firefox(17.0.1), Safari
    //And also doesn't work on Windows in Chrome
    jQuery('input').focus(function(){
        jQuery(this).val('');
    });

    //Same on events: change, click, select, on
    jQuery('.checkbox').click(function(){ 
        alert(jQuery(this).val());
    });
});

以下是示例http://jsfiddle.net/nonamez/Gq8VK/

Answer 1

Firefox正在做它想象的事情，在焦点上它将值设置为空白运行单击回调，提醒您刚刚设置的银行值。在基于Webkit的浏览器中，您可以在元素上包含“tabindex”属性，并使用它来检查焦点。当您使用鼠标触发焦点事件时，Webkit不起作用，它似乎适用于输入和textareas。

Answer 2

并非所有浏览器在表单元素方面都具有相同的行为。您所看到的是，webkit浏览器不会导致复选框因click事件而被聚焦。这是否是一个错误将由w3规范决定。

我无法在w3.org上找到关于这个主题的明确答案。我发现的大部分内容似乎都表明这取决于用户代理。

但是，您可以通过在脚本中包含此内容来使所有浏览器的行为相同：http://jsfiddle.net/Gq8VK/5/

// Any input that does not receive focus from a mouseclick 
// will now do so, in all browsers. This shouldn't affect browsers that
// focus input elements on click. 
$(document).on('mouseup', 'input', function(){
    if (!$(this).is(":focus")) $(this).focus();
});

脚本正在使用事件委托，因此它适用于所有输入，包括附加事件时DOM中不存在的输入。

在小型研究之后，Mac和Win中的奇怪jQuery行为

2 个答案: