jQuery單擊空白區域上的事件

我試圖捕捉一個事件，當用戶用jQuery在頁面上單擊空白區域時。例如，假設你有以下幾種：jQuery單擊空白區域上的事件

<html> 
<head> 
    <title>Test</title> 
</head> 
    <body> 
     <p>Here's some text!</p> 
    <body> 
</html>

我想，當用戶點擊什麼，但 p標籤趕上事件。

有沒有辦法來捕捉這樣的事情？

來源

2009-08-21 Adam Mika

我很想知道你爲什麼要這種行爲？ – 2009-08-21 02:32:08

我正在製作一個類似於Taskpaper（適用於Mac）的小型網絡應用程序，我希望它能夠模仿應用程序的行爲。更多的概念證明比其他任何東西都要多。 – 2009-08-21 02:39:36

這適用於chrome。還沒有嘗試過其他瀏覽器。工作過的想法，stickmangumby有：

$('body').click(function (e) { 
    if (e.target == this) 
     alert('works'); 
});

來源

2009-08-21 02:47:33 MacAnthony

啊，我忘了所有關於目標屬性。這完全符合我已經得到的。所有其他答案的工作，以及我只是認爲這是最好的處理點擊身體（或在我的情況下，html標籤級別）的一個事件 – 2009-08-21 03:20:41

我只想指出，這將不適用於屏幕上的每個點，除非至少是窗口寬度和高度的100％。 – 2009-08-21 04:09:15

正確，這就是爲什麼我將它從$（'body'）選擇器切換到我的代碼中的$（'html'）選擇器，以避免手動更改身體的高度和寬度。 – 2009-08-21 14:15:13

您可以觀察文檔的onclick，然後檢查事件處理函數中的event.currentTarget。

來源

2009-08-21 02:27:17 nfm

你可以做這樣的事情（我認爲）

$('body').not('p').click(function(){});

不知道如何將工作，雖然。

來源

2009-08-21 02:27:45 theIV

我相信只會過濾選擇器，並不會影響點擊事件冒泡。 – MacAnthony 2009-08-21 02:28:55

很酷。至少我從中學到了一些東西！：）謝謝。 – theIV 2009-08-21 02:31:04

這似乎工作：

$(function() { 
    $('body').click(function() { 
     alert('clicked the page'); 
     return false; 
    }); 
    $('*:not(body)').click(function() { 
     alert('clicked an item!'); 
     return false; 
    }); 
});

一個「問題」，你必須是段落默認塊元素，所以點擊一個句子的側面將產生項目點擊即使它看起來就像你沒有點擊一個項目一樣。

來源

2009-08-21 02:34:30

我正在做一個小的web應用程序是類似於Taskpaper（適用於Mac）和我希望它模仿應用的行爲。比什麼都

在您的意見光更多概念的證據，我就不會擔心身體特別呢。而是連接一個div，以便您可以約束您想要對事件做出反應的區域。在頁面上沒有其他元素的情況下，它是一樣的。

在任何網頁上，如果點擊任何空白處的任何內容都會產生什麼效果，那麼用戶會討厭你 - 這將會是一種糟糕的UI體驗。

來源

2009-08-21 03:23:06

我認爲這很大程度上取決於他計劃在事件發生時做什麼。如果你不知道自己在做什麼，那麼說他做的事很糟糕。 – MacAnthony 2009-08-21 04:02:20

啊，但我確實問過我爲什麼，我確實有一個他想做什麼的好主意，這就是爲什麼它是以「根據你的意見」開頭的原因。我還認爲，鉤住身體點擊事件是一個壞主意，即使它是一個概念證明。 – 2009-08-21 05:35:12

「你的用戶會恨你，如果在任何地方點擊任何空格都會做些什麼 - 這將是一個糟糕的UI體驗」實際上，這正是Taskpaper所做的。無論你點擊它的主窗口，你要麼正在輸入新的任務，要麼正在編輯已經在屏幕上的東西。 – 2009-08-21 14:12:42

我正在尋找類似問題的解決方案 - 在單擊文檔時隱藏自定義工具提示，但在單擊提示內部時隱藏自定義工具提示。我這樣做（改變選擇匹配的問題）：

$(document).bind('click', function(e) { 
    if($(e.target).closest('p').length == 0) { 
     //p is not clicked. do your stuff here 
    } 
});

來源

2011-07-17 09:14:36 bobef

jQuery單擊空白區域上的事件

回答

相關問題