Question

我需要“呼叫链接”才能使用slideToggle打开每个项目的抽屉，但.next方法似乎找不到class。我的语法不正确吗？任何帮助都会非常感激：D

干杯！

HTML

<article class='tile'>
    <h2>Lorem Ipsum</h2>
    <p>Get international support.</p>

    <ul>
        <li><a class='call' style="background-image: url(img/icon_call.png);" href='#'>Call us</a></li>
        <li><a id='chat' style="background-image: url(img/icon_chat.png);" href='#'>Live Chat</a></li>    
    </ul>

 </article>

 <span class='med_div'></span>

 <section class='drawer'>
        <a href='tel:' class='block_item'><span class='title pull-left'>Wireless</span><span class='number pull-right'>770-5566</span></a>
        <a href='tel:' class='block_item'><span class='title pull-left'>GoPhone&reg;</span><span class='number pull-right'>770-5566</span></a>
        <a href='tel:' class='block_item'><span class='title pull-left'>Wireless Home Phone</span><span class='number pull-right'>770-5566</span></a>
</section>

<article class='tile'>
    <h2>Lorem Ipsum</h2>
    <p>Get international support.</p>

    <ul>
        <li><a class='call' style="background-image: url(img/icon_call.png);" href='#'>Call us</a></li>
        <li><a id='chat' style="background-image: url(img/icon_chat.png);" href='#'>Live Chat</a></li>

    </ul>   

 </article>

 <span class='med_div'></span>

  <section class='drawer'>
        <a href='tel:' class='block_item'><span class='title pull-left'>Wireless</span><span class='number pull-right'>770-5566</span></a>
        <a href='tel:' class='block_item'><span class='title pull-left'>GoPhone&reg;</span><span class='number pull-right'>770-5566</span></a>
        <a href='tel:' class='block_item'><span class='title pull-left'>Wireless Home Phone</span><span class='number pull-right'>770-5566</span></a>    

</section>

JS

<script>

$(document).ready(function(){    
$('.call').click(function() {
  $('this').next('.drawer').slideToggle('slow', function() {
  });
});
});     

</script>

Answer 1

您的代码中存在多个问题

this是对象引用而不是字符串
.drawer是已点击的next().next()元素父.call

.tile

你必须使用

$('.call').click(function() {
    $(this).closest('.tile').next().next('.drawer').slideToggle('slow', function() {
    });
});

演示：Fiddle

如何在多个元素上使用jQuery slideToggle？

1 个答案: