jQuery .blur（）和.focus（）事件的问题

我有一个有几个输入字段的窗体。当用户点击一个输入字段时，会出现一个隐藏的div，并为该字段进行一些选择，然后他们可以选择一个选项，并将其设置为字段值。jQuery .blur（）和.focus（）事件的问题

目前，div被隐藏的方式是当用户选择一个选项。这工作正常，但如果用户不想选择一个选项，该div将不会被删除。所以，我的解决方案是在输入字段上使用模糊事件，这会隐藏它们的div元素。这样，用户可以在表单中选中，看到隐藏的div，并在离开该字段时隐藏它。这也可以正常工作。

问题出现时，他们现在想要点击div中的某些内容填充到输入中。因为我甚至添加了模糊效果，甚至在用户尝试单击div中的选项时触发，在用户单击之前有效地隐藏div，因此不会向输入字段添加任何内容。

解决此问题的最佳方法是什么？我想要使用blur事件来隐藏div，但是当用户想要在div内单击时，需要有某种异常，而blur事件不会隐藏他们尝试点击的div。

感谢您的帮助。

来源

2009-09-15 Nic Hubbard

您可以在blur事件上设置超时时间，并且只有当另一个输入字段处于焦点时，才会立即隐藏“帮助div”。

事情是这样的：

$("#input1").focus(function() { 
     hideAllHelpers(); $("#helper1").show(); 
}); 

$("#input1").blur(function() { 
     window.setTimeout(function() { $("#helper1").hide(); },2000); }); 
}); 

$("#input2").focus(function() { 
     hideAllHelpers(); $("#helper2").show(); 
}); 

// etc...

你当然可以使它更通用的，它可以使用一些微调，但你的想法...

来源

2009-09-15 19:20:16

的onblur，设定的超时在隐藏相应的div之前等待一秒钟。然后，点击，清除超时。这里有一个基本的例子...

// Namespace for timer 
var myPage = { 
    timer: null 
} 

// Blur event for textbox 
.blur(function() { 
    myPage.timer = setTimeout(function() { 
    // Hide the div 
    }, 1000); 
}); 

// Click event for DIV 
.click(function() { 
    clearTimeout(myPage.timer); 
    // Fill in the textbox 
    $(this).hide(); 
});

来源

2009-09-15 19:20:45

我会把添加一个关闭按钮，并在该字段后立即制表符。这将解决用户不知道秘密的问题（通过标签）可能没有意识到有一种方法可以在没有选择选项的情况下解除对话。

来源

2009-09-15 19:38:52

使用mousedown事件，该事件在用户单击帮助器元素但在输入元素上触发blur事件之前触发。

$('#input').blur(function() { 
    $('#helper').hide(); 
}); 

$('#helper').mousedown(function() { 
    console.log('This executed before the blur event'); 
});

来源

2013-01-10 23:49:13 d2vid

jQuery .blur（）和.focus（）事件的问题

回答

相关问题