jQuery焦点/模糊forms，而不是个人输入

怎么可以通过jQuery实现？

当用户点击表单中的任何输入时，它会被聚焦。 当用户从任何输入中单击窗体时，它会变得模糊，但是，在窗体本身的输入之间的选项卡之间不会触发模糊。

对于这样的事情，我们正在研究这个基本结构：

再说一次，让我说我点击表单中的任何输入，我们知道表单是重点。 接下来，当用户点击任何输入时，只有在我们点击表单外部时才会触发模糊。

我之前已经问过这个问题，并且在表格中的最后一个输入字段模糊但不是来自输入列表中的任何元素时，如何获得有关如何实现模糊效果的输入。

谢谢，马克安德森

Answer 1

当您在输入之间进行选项卡时的事件序列：

  Click on input1: input1 focus Clickb on input2: input1 blur input2 focus Click outside: input2 blur 

当输入失去焦点时，您需要检查表单中的其他元素是否获得焦点。 或者您可以简单地检查活动元素是否仍在表单中：

 $('form').on('focusout', function(event) { setTimeout(function() { if (!event.delegateTarget.contains(document.activeElement)) { console.log('Form blur'); } }, 0); }); 

的jsfiddle

请注意，表单在提交时不会模糊，因此如果要在模糊和提交时执行相同的操作，则可能需要添加提交处理程序。

还要注意使用setTimeout ，这是必需的，因为当元素即将失去焦点时会发出blur和focusout事件，但还没有丢失它。

Answer 2

将$('form').focusin()/focusout()不起作用？

http://api.jquery.com/focusout/

Answer 3

这是与Alexey相同的基本思想，但是对于jQuery 1.7+，至少在我看来，它更具可读性，因为它将所有内容都保存在同一个处理程序中：

  $("#myform").on("focusout focusin", "input", function(e){ if ( e.type == "focusout" ) { $("#myform").attr("form-blur-timeout", window.setTimeout(function(){ console.log("you've left the form!");//do stuff here }, 100)); } else { window.clearTimeout($("#myform").attr("form-blur-timeout")); } }); 

请享用 ：）

Answer 4

你可以这样做：

 var check; $('form input').focus(function() { clearInterval(check); // remove setinterval if any // do something because the form is being used }); $('form input').blur(function() { check = setInterval(function() { // do something because the form is not being used },500); // half-second delay }); 

这不是最性感的解决方案，但会在0.5秒后检查表单中是否没有焦点。 希望这可以帮助。