使用元素id在单击页面的其他部分时隐藏div
使用元素id在单击页面的其他部分时隐藏div
提问于 2014-06-03 20:49:12
在我的网站上，我有很多搜索框。当单击外部搜索结果时，我使用javascript隐藏搜索结果。为此，我使用以下代码
$(document).click(function (e) {
if (!$(e.target).is('#elem1, #elem2, #elem3, #elem4, #elem5')) {
$("#elem1").hide();
$("#elem1").html("");
$("#elem2").hide();
//$("#elem3").hide();
$("#elem4").show();
$("#elem5").show();
}
});搜索字段为
<form name="form-name">
<input type="text" value="" id="search-field" />
<button value="search" id="search-button">
</form> 搜索列表是
<div id="id1">
<ul>
<li>data2</li>
<li>data3</li>
<li>data4</li>
<li>data5</li>
<li>data6</li>
</ul>
</div>我通过下面的代码识别enter出版社
$("#search-field").keyup(TriggeredFunction);
function TriggeredFunction(e) {
e = e || window.event;
var keycode;
if (window.event) {
keycode = e.which ? window.event.which : window.event.keyCode;
}
var key = e.which;
switch (key) {
case 13:
//action code
break;
default:
//default code
}
}这段代码运行得很好。li上的点击事件非常完美。但是有一次，我试图编写一个函数，当我按下enter键时会调用该函数。enter按键调用了上面的$(document).click()函数(这一次li上的click也可以正常工作)。使得搜索结果变为空。我正在从搜索结果中获取数据。正因为如此，我无法获取数据。有什么方法可以防止这种情况发生吗？请帮帮忙
回答 1
Stack Overflow用户
发布于 2014-06-04 00:13:45
您最好停止搜索字段上的事件冒泡。
在JQuery中：
$( "#search-field, #search-button" ).click(function( event ) {
event.stopPropagation();
});在vanilla JavaScript中：
if(event.stopPropagation) {
event.stopPropagation();
} else {
event.cancelBubble = true;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/24015657
复制相关文章
相似问题
腾讯云开发者
