0

I need the "Call link" to open the drawer for each item using slideToggle, however the .next method doesn't seem to be finding the class. Is my syntax incorrect? Any help would be MUCH appreciated :D

Cheers!

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>
4

1 回答 1

1

您的代码中存在多个问题

  1. this是对象引用而不是字符串
  2. .drawer是被点击元素父级的next().next()兄弟.call.tile

你必须使用

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

演示：小提琴

于 2013-07-26T02:28:26.660 回答