怎么可以通过jQuery实现?
当用户点击表单中的任何输入时,它会被聚焦.当用户从任何输入中单击窗体时,它会变得模糊,但是,在窗体本身的输入之间的选项卡之间不会触发模糊.
对于这样的事情,我们正在研究这个基本结构:
<form> <input ... /> <input ... /> <input ... /> </form>
再说一次,让我说我点击表单中的任何输入,我们知道表单是重点.接下来,当用户点击任何输入时,只有在我们点击表单外部时才会触发模糊.
我之前已经问过这个问题,并且在表格中的最后一个输入字段模糊但不是来自输入列表中的任何元素时,如何获得有关如何实现模糊效果的输入.
谢谢,
马克安德森
解决方法
当您在输入之间进行选项卡时的事件序列:
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); });
请注意,表单在提交时不会模糊,因此如果要在模糊和提交时执行相同的操作,则可能需要添加提交处理程序.
还要注意使用setTimeout,这是必需的,因为当元素即将失去焦点时会发出模糊和聚焦事件,但还没有丢失它.