检查用jQuery单击了哪个元素

Question

我试图使用'if'语句来确定单击了哪个元素.

基本上我正在尝试编写以下内容:

if (the element clicked is '#news_gallery li .over') {
    var article = $('#news-article .news-article');
} else if (the element clicked is '#work_gallery li .over') {
    var article = $('#work-article .work-article');
} else if (the element clicked is '#search-item li') {
    var article = $('#search-item .search-article');
};

什么是适当的jQuery语法？提前谢谢了.

Answer 1

使用这个,我想我可以得到你的想法.

现场演示: http ://jsfiddle.net/oscarj24/h722g/1/

$('body').click(function(e) {

    var target = $(e.target), article;

    if (target.is('#news_gallery li .over')) {
       article = $('#news-article .news-article');
    } else if (target.is('#work_gallery li .over')) {
       article = $('#work-article .work-article');
    } else if (target.is('#search-item li')) {
       article = $('#search-item .search-article');
    }

    if (article) {
       // Do Something
    }
});?

Answer 2

所以你这样做有点倒退.通常你会做这样的事情:

?<div class='article'>
  Article 1
</div>
<div class='article'>
  Article 2
</div>
<div class='article'>
  Article 3
</div>?

然后在你的jQuery中:

$('.article').click(function(){
    article = $(this).text(); //$(this) is what you clicked!
    });?

当我看到类似的东西#search-item .search-article时#search-item .search-article,#search-item .search-article我觉得你过度指定了CSS,这使得编写简洁的jQuery变得非常困难.如果可能的话应该避免这种情况.

Answer 3

来自vpiTriumph的回答很好地阐述了细节.
当您想要访问的数据集有唯一元素ID时,这是一个小方便的变体:

$('.news-article').click(function(event){    
    var id = event.target.id;
    console.log('id = ' + id); 
});