Question

我有一个＆＃34;父div＆＃34;包含子框输入type=number。当用户在输入框外单击时，我使用父div的blur或focusout事件来使用其他位置的输入值。

我还需要在某个地方使用$('inputbox').trigger('focus')，这会不必要地触发＆＃34;父div和＃34;模糊事件，并在该事件上运行代码。

请提供一个解决方案，以便在儿童焦点上停止此父模糊事件，或者找出一种方法来查找焦点是通过触发器（＆＃39;焦点＆＃39;）对子元素进行还是通过用户点击外部父母div。

我只有在用户点击它之外时才需要激活父Blur＆amp;不是通过代码触发焦点时。

Answer 1

使用jquery，您可以非常轻松地制作自定义事件，例如：

$('inputbox').trigger('special-focus');

然后你可以像其他任何事件一样等待这个事件：

$('div').on('special-focus' , function(){ ... } );

这可以防止您的活动干扰内置活动。

我想如果您不想使用该建议，请在您的点击处理程序或您孩子的焦点处理程序中执行此操作

 .on('focus' , function(e){
    e.stopPropagation();
    e.preventDefault();
   /// the rest of your code ...
 });

这将停止将事件传播到父元素

Answer 2

对我来说有用的是检查处理函数中relatedTarget对象的eventObject属性。

$("#parentDiv").focusout(function (eventObject) {
    if (eventObject.relatedTarget.id === "childInputId")
        /// childInput is getting focus
    else
        /// childInput is not getting focus
});

Answer 3

这对我来说很完美：

if (e.relatedTarget === null) ...

Answer 4

父母的

.on('blur',...)会在孩子的 .on('focus' ,...)之前触发。
无论如何，对于包含子输入框的父div 我们可以使用
$('input').trigger('special-focus');
然后

$("#form" ).on('special-focus', '.parentdiv' , function(event) { $("#form" ).off('blur', '.parentdiv'); $(event.target).focus(); $("#form" ).on('blur', '.parentdiv' , showValuesOnBlur); });

现在，父母的模糊不会对孩子的焦点产生影响。
这对我有用。即关闭＆amp;关于特殊焦点内的父模糊事件。
谢谢Scott Selby：）

处理通过关注子元素而点击的父元素的模糊事件，并点击子元素的外部

4 个答案: