Question

我试图在td上使用模糊，p没有任何成功。 Jquery documentation说

“最初，此事件仅适用于表单元素，例如输入。在最近的浏览器中，事件的域已被扩展包括所有元素类型。“

所以它应该触发p / td标签。这是我的示例代码

<p>Test 2
</p>
<p>Test 1
</p>
<script>
    $(document).ready(function () {
        $("p").blur(function () {
            alert('blur');
        });

    });
</script>

但请注意，如果我尝试以编程方式调用模糊，则会触发。

$("p").blur();

我假设当我点击第一张p然后点击其他任何地方时，模糊应该点亮... 我在这里错过了什么吗？

由于

Answer 1

模糊是焦点事件的相反事件。除非p标签设置了tabindex，否则无法对其进行聚焦，因此p标签不会模糊。

将tabindex属性添加到p标签中，并在标签或点击后触发模糊。

<p tabindex="10">test 1</p>
<p tabindex="11">test 2</p>

焦点事件：http://jsfiddle.net/b98Bs/

模糊事件：http://jsfiddle.net/b98Bs/1/

（如果你点击p，请记得在发射事件后点击它）

更新：

我已经包含了第二个jsfiddle来显示模糊以及焦点，事件也会显示一个警告，显示失去焦点的p元素的文本。

如果您希望tabindex遵循文档中元素的顺序，请将它们设置为tabindex =“0”：http://jsfiddle.net/b98Bs/2/

Answer 2

模糊事件不适用于像p这样的元素。它通常与输入文本一起使用。如果你专注，你可以触发事件'焦点'，当焦点出来时，它是模糊事件。你可以在那里使用模糊事件。模糊事件表明失去了焦点。

在下面的示例中，当焦点消失时，输入文本的颜色变为红色。对焦时，颜色为黄色。

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){ 
$("#blurr").blur(function(){
  $(this).css("color","yellow");
}); 
$("#blurr").focus(function(){
    $("#blurr").css("color","red");
  });   
});
</script>
</head>
<body>
<input type="text" id="blurr" value="click Here"/>
</body>
</html>

模糊不会在p标签上触发

2 个答案: