jQuery获取点击的元素的子元素

jQuery获取点击的元素的子元素
如图所示,要我们监听div元素的点击事件,对网页进行跳转;而子元素a被点击,会触发目标网页二次加载。
我们如果能只监听div下面a元素以外的元素被点击的事件,就可以避免网页两次加载。
要实现这一目的,需要用到jQuery.Event这个属性。

下面按照上图的例子来说明该属性的用法(假设div的类名为what-class)。
$("div.what-class").click(function(e){
    alert(e.target.nodeName);
});


这样一来,如果点击span标签,就会打印“SPAN”;如果点击a标签,就会打印“A”;如果点击这span和a元素以外,又在div之内的地方,就会显示“DIV”。
聪明的您已经知道,这个“e.target”就是jQuery获取点击元素的属性了。
这里使用节点名来区分,如果要用类名,可以打印“e.target.className”。

下面给一个完整的例子,获取被点击的div中第一个a元素的href属性来跳转网页。
$(document).ready(function(){
    $("div.what-class").click(function(e){
        if(e.target.nodeName != "A") {
            location = $(this).find("a:first").attr("href");
        }
    });
});


至此,相信用jQuery来获取点击的元素或者其子元素的办法您已经知道了,马上自己试试吧!


4