jQuery，选择（任何所有*）元素点击

我正在为自己构建一个调试工具。我希望它做的是在任何元素点击时放置一个类。jQuery，选择（任何所有*）元素点击

事情是这样的：

$('*').click(function(){$(this).toggleClass('debug')});

也就是说实际工作，除了它切换“调试”的所有元素。

例如：

<body> 
<div id='3'> 
    <div id='2'> 
     <div id='1'></div> 
    </div> 
</div> 
</body>

如果我点击<div id="1">，它将一个名为 “调试” 类添加到<div id="2">和<div id="3">。

发生了什么事情是当你点击<div id="1>时，它被视为对所有3的点击，因为从技术上讲，所有的div都被点击。所以我想过要有一个拥有所有HTML元素的数组。

到目前为止，我有：

window.v = []; 
$('*').click(function(){window.v.push(this)});

在此之后，它是：

$(window.v[0]).toggleClass('debug');

不幸的是，当这样的：

$(window.v[window.v.length]).toggleClass('debug');

...或以上执行时，它没有做任何事情。有时，它将“调试”类放在body标签上。

所以，我不完全确定如果使用阵列是最好的路线。有没有人有任何想法如何普遍点击任何元素并将调试类放在它上面？

在此先感谢。

2011-09-07 iNk

这样做：

$(window).click(function (e) { 
    $(e.target).toggleClass('debug'); 
});

绑定点击处理程序所有 DOM元素是一个坏主意。相反，将一个单击处理程序绑定到window对象。你可以这样做，因为点击事件冒泡（DOM树）。为了确定哪个元素被点击，使用e.target。

这么简单:)

2011-09-07 22:55:24

对不起，忽略了 - 我错过了什么。 – Ryan

@minitech没问题'：）' –

我一般都喜欢这个想法，但是如果点击是在对象本身（像一个按钮）处理并且冒泡可能被阻止的话，它会起作用。 – jfriend00

取消泡：

$('*').click(function(evt) { 
    $(this).toggleClass('debug'); 
    evt.stopPropagation(); 
});

2011-09-07 22:56:07 Ryan

回答