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

Answer from vpiTriumph很好地阐述了细节当您想要访问的数据集有唯一元素ID时，这是一个小方便的变体：

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

Answer 4

jQuery的基础是能够通过选择器在DOM中查找项目，然后检查这些选择器上的属性。在这里阅读选择器：

http://api.jquery.com/category/selectors/

但是，为点击事件创建事件处理程序更有意义，因为根据点击的内容，应该发生不同的功能。

Answer 5

希望这对你有用。

$(document).click(function(e){
    if ($('#news_gallery').on('clicked')) {
        var article = $('#news-article .news-article');
    }  
});

Answer 6

另一种选择可以是利用tagName的{{1}}属性。它并不完全适用于此，但我们说我有一类适用于e.target或DIV标记的内容，我想要查看是否单击了该类，并确定是单击了A还是DIV。我可以这样做：

Answer 7

$("#news_gallery li .over").click(function() {
    article = $("#news-article .news-article");
});

检查用jQuery单击了哪个元素

7 个答案: