在jQuery中執行點擊的最簡單的方法是什麼div框隱藏,如果點擊任何地方在它外面的任何地方。在jquery中的點擊
回答
我不喜歡,因爲通常我使用事件冒泡來管理各個環節使用stopPropagation
的解決方案。如果盒子存在,我不必擔心他們可能會停止工作。我的選擇會是這個樣子:
var $box = $('#box');
$(document.body).click(function(){
if (!$box.has(this).length) { // if the click was not within $box
$box.hide();
}
});
的has
功能過濾器的選擇,並返回元素只有在包含的參數(你也可以使用一個選擇字符串傳遞的元素,但在這裏不相關)。如果點擊在框外,length
將爲0
,因此條件將通過,並且框將被隱藏。
這應該通過設置一個布爾值來確定是否當前可見,並且只在當前可見時才執行has
調用。
$('body').click(function() {
$('#box').fadeOut();
});
$('#box').click(function(e) {
e.stopPropagation();
});
這是可行的,因爲如果您單擊裏面,#box將首先收到點擊事件。由於傳播已停止,附着在身體上的處理程序將不會收到它,因此除非您在盒子外面單擊,否則該盒子將不會關閉。
如果你要立即隱藏,使用.hide()
我已經得到了stopPropagation()從How do I detect a click outside an element?
招我知道,jQuery的有"focusout"事件表單元素,不知道這是否可能也許可以用於
像這樣:
$("#thediv").show(0, function() {
var that = $(this);
$(document).bind("click", function(e) {
if($(e.target).attr("id") != that.attr("id")) {
that.hide();
$(this).unbind("click");
}
});
});
幹得好,不過@lonesomeday的方式更乾淨。 – Hussein 2011-01-29 01:36:42
綁定點擊函數文檔本身:
$(document).click(function(){
alert('doc');
});
那麼功能結合於DIV本身相同的事件,並返回false,這樣的事件不會冒泡到文檔。
$('#mydiv').click(function(e){
alert('mydiv click');
return false;
}
更好地使用`e.stopPropagation()`而不是`return false;`。 – ThiefMaster 2011-01-28 21:00:04
繼承人我的解決方案
var ClickOut = {};
ClickOut.list = [];
ClickOut.Add = function(jqel, callback) {
var i = ClickOut.list.push({jqel:jqel, callback:callback});
return (i-1);
}
ClickOut.Remove = function(i) {
ClickOut.list.splice(i, 1);
}
ClickOut.Init = function() {
$('body').click(function(e) {
for(var x = 0; x < ClickOut.list.length; x++) {
if (!ClickOut.list[x].jqel.has(e.target).length) {
ClickOut.list[x].callback();
}
}
});
}
我建議使用此LIB https://github.com/gsantiago/jquery-clickout。這很棒!
$('button').on('clickout', function (e) {
console.log('click outside button')
})
- 1. JQuery的:在點擊
- 2. 在jquery中多次點擊
- 3. 在jquery中觸發點擊
- 4. 通過點擊/點擊Jquery中的刪除點擊類?
- 5. jQuery的:點擊
- 6. 點擊jQuery的
- 7. jQuery的點擊
- 8. jQuery的點擊
- 9. JQuery的點擊
- 10. jQuery的點擊
- 11. 點擊fadeToggle jQuery中
- 12. 上點擊jQuery中
- 13. jQuery - 不要在'mousemove'上點擊'點擊'
- 14. jQuery - 可以在href上點擊點擊
- 15. 用jquery點擊div點擊
- 16. jQuery的 - 在點擊輸入
- 17. 在點擊閱讀IM中的IMG jQuery
- 18. 在jQuery中記錄點擊的順序?
- 19. jQuery的點擊忽略父點擊
- 20. 點擊按鈕的文本點擊jquery
- 21. 點擊jQuery的功能arent點擊
- 22. jQuery的點擊(只點擊)不工作
- 23. 點擊菜單裏的點擊(js,jquery)
- 24. jQuery奇怪的行爲()點擊()點擊()
- 25. jQuery的DIV點擊,抓不良點擊
- 26. jQuery的點擊功能已經點擊/
- 27. 。對( '點擊' ......對。點擊jQuery的
- 28. jQuery的,點擊可點擊元素
- 29. jQuery的。點擊()點擊一個鏈接
- 30. jQuery的觸發點擊「點擊」屬性
這會隱藏它,如果你點擊裏面的div,而不是外面。 – 2011-01-28 20:56:01
啊..誤解了這個問題。 – ThiefMaster 2011-01-28 20:56:29