Question

我有三个文章标签，每个标签都有一个我需要动画显示的部分，即从0px到任何px的高度。每篇文章都有一个ID，为每个文章提供一个单击事件的最有效方法是什么，而不为每个单独的id编写单独的函数，即是否有“获取点击文章的id”类型方法？

由于

Answer 1

这就是我要做的，

jQuery的：

$('.art h1').on('click', function() {
   $(this).parent().find('p').stop(true).slideToggle(); 
});

HTML：

<div class="art">
    <h1>Some article stuff</h1>
    <p>text goes here</p>
</div>

小提琴：JSFIDDLE

如果你想让它向上滑动并且一次只打开一个，那么你可以进行一次小编辑，

jQuery的：

$('.art h1').on('click', function() {    
    $('.art p').slideUp();
    $(this).parent().find('p').stop(true).slideToggle(); 
});

小提琴：Only one active JSFIDDLE

Answer 2

您可以将多个选择器与逗号结合使用：

$('#id1,#id2,#id3').click(function() {
    $(this).animate(...);
});

...或者您可以为每个元素添加class="something"，然后选择：

$('.something').click(function() { ... });

Answer 3

对click事件使用类而不是id。然后，您可以使用id或其他属性来标识要展开的文章。

$('.someClass').click(function() {
          thisId = $(this).attr('id');

            $('#whereTheSectionsAre').find('.active').removeClass('active').next().slideUp(400);
            $(thisId+'article').toggleClass('active').next().slideDown(400);

          return false;
        });

Answer 4

你可以在这里查看一些例子，主要是如果id是动态的：

http://jsbin.com/uzEkiQa/3/

第一种方法是已建议的方法，但具有动态ID：

$('div[id^="id_"]').text("Changed by regexep");

第二个如果您的匹配是更硬核使用过滤器：

var reg = new RegExp（/ id_ \ d + /）;

  $('div[id^="id_"]')
  .filter(function(index, item) {
    return reg.test(item.id);
  })
  .text("Changed by filter and regexp");

选择后，您可以应用所需的行为。检查JSBin来玩。

使用jQuery来切换特定的类[误导？]

4 个答案: