根据选择器编号切换元素

Question

我知道有更好的方法可以做到这一点！

$('.press-125').click(function(){
    $('.fullpress-125').slideToggle();
});

$('.press-128').click(function(){
    $('.fullpress-128').slideToggle();
});

......等等。希望有人可以帮我解决这个问题。

Answer 1

如果你可以改变html使用一个公共类和一个data- *属性，如

$('.press').click(function () {
    $('.fullpress-' + $(this).data('id')).slideToggle();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<ul>
  <li class="press" data-id="123">123</li>
  <li class="press" data-id="125">125</li>
  <li class="press" data-id="126">126</li>
  <li class="press" data-id="127">127</li>
  <li class="press" data-id="128">128</li>
  </ul>

<div class="fullpress-123">123</div>
<div class="fullpress-125">125</div>
<div class="fullpress-126">126</div>
<div class="fullpress-127">127</div>
<div class="fullpress-128">128</div>

Answer 2

它也是可能的

$('[class^=press]').click(function(){
    $('.fullpress-' + $(this.attr('class').split("-")[1])).slideToggle();
});

Answer 3

如果您使用ID而不是class属性会更好，但这应该可行

$("[class^='press-']").click(function(){
    var className = $(this).attr('class');
    $('.full'+className).slideToggle();
});