Focusout if not element is clicked (请参阅小提琴)
Focusout if not element is clicked (请参阅小提琴)
提问于 2013-01-17 00:00:19
当我写一些东西时，我的输入字段中会动态地显示一个“清晰”的-icon。Keypress和focus事件处理得很好，唯一的问题是我希望在输入字段未处于focus模式时删除图标。问题是，我在图标上有一个click事件，所以如果我单击该图标，则会触发focusout event。我想不出来。
$(".searchInput").focusout(function(e) {
console.log(e);
if(e.currentTarget != this) {
if ($(".keypress").length > 0) {
$(".keypress").remove();
}
}
})我组合了一个小提琴：http://jsfiddle.net/w9RbW/。
正如你所看到的，如果输入值不是空的，图标仍然在那里，我不知道如何检查它是否被点击，或者类似的东西……
回答 4
Stack Overflow用户
回答已采纳
发布于 2013-01-17 00:16:30
问题(正如你所知道的)是，当你从文本框中移出焦点时，清除图标在它的click事件被激发之前就被移除了。一种可能的解决方案是改变透明图标的不透明度，而不是移除它，以便它仍然继续接收事件。
演示： http://jsfiddle.net/w9RbW/10/
// Have the clear icon in there all the time
$("<span class='keypress'><i class='icon-remove-sign'></i></span>").appendTo($(".searchInput").parent());
$(".keypress").click(function(e) {
if($(this).css('opacity') == 0) return;
$(".searchInput").val("").focus();
$(this).css('opacity', '0'); // hide it after clearing the text
})
// focusout
$(".searchInput").blur(function(e) {
$(".keypress").css('opacity', '0'); // hide it on blur
})
$(".searchInput").focus(function() {
if ($(".searchInput").val() != "") {
$(".keypress").css('opacity', '1'); // show it
}
})
$(".searchInput").keyup(function() {
if($(this).val() != "") {
$(".keypress").css('opacity', '1');
} else {
$(".keypress").css('opacity', '0');
}
})Stack Overflow用户
发布于 2013-01-17 00:06:24
查看此http://jsfiddle.net/w9RbW/8/
如果您只想在不在焦点时移除图标。
$(".searchInput").focusout(function(e) {
$(".keypress").css('opacity', '0');
if(e.currentTarget != this) {
if ($(".keypress").length > 0) {
$(".keypress").remove();
}
}
})Stack Overflow用户
发布于 2013-01-17 00:07:47
你为什么不设置一个计时器，每10秒检查一次“清除”图标是否在那里！一旦你发现文本框失去了焦点，你就可以移除那个清除的图标并停止计时器
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/14362529
复制相关文章
相似问题
腾讯云开发者
