如何在Jquery中触发下一个父级内的子级

时间:2014-04-27 22:37:52

标签: jquery

它很容易触发父母内部的元素。但是,当我想转移到另一个父母并开始触发它的孩子时,没有任何事情发生。 我有简单的HTML。

    <ul  class="gallery">

    <button class="prev">Prev</button><!--end btnLeft-->
  <button class="next">Next</button><!--end btnRight-->
    <li>
<div class="wrapper">
                <span class="slide-title">Title</span>
<div class="dark">
<img src="http://www5.mercedes-benz.com/media/image/master/mercedes-benz-dtm-oschersleben-race-master_1_380_211.jpg" alt="horse">
<p>Mercedes</p>
<a href="http://www5.mercedes-benz.com/en/">Купить</a>

    </div>
    </div>


    <div class="wrapper">
<div class="dark">

<img src="http://www.nationalgeographic.com/dc/exposure/homepage/photoconfiguration/image/15042_photo_whdvenf37y72uer4efd6rx2wltvu2hmpyjyavf6lo6pvvsfavj3q_480x360.jpg" alt="cat">
    <p>Mercedes</p>
<a href="http://www5.mercedes-benz.com/en/">Купить</a>

    </div>
    </div>

    <div class="wrapper">
<div class="dark">

<img src="http://www.nationalgeographic.com/dc/exposure/homepage/photoconfiguration/image/14946_photo_6slgabdfc5qowfkf2umhj3h4dgguoo4tfzqnozlypf2gukfxr27q_480x360.jpg">
  <p>Mercedes</p>
<a href="http://www5.mercedes-benz.com/en/">Купить</a>
    </div>

    </div>
        </li>
    <li>
        <div class="wrapper">
<div class="dark">
        <img src="http://images.nationalgeographic.com/wpf/media-live/photos/000/685/overrides/eight-inch-two-week-old-caiman_68508_160x120.jpg">
  <p>Mercedes</p>
<a href="http://www5.mercedes-benz.com/en/">Купить</a>
    </div>
    </div>

  <div class="wrapper">
<div class="dark">
       <img src="http://images.nationalgeographic.com/wpf/media-live/photos/000/493/cache/sillett-redwood-tree-450_49311_160x120.jpg">
  <p>Mercedes</p>
<a href="http://www5.mercedes-benz.com/en/">Купить</a>
        </div>
    </div>

      <div class="wrapper">
<div class="dark">
                <img src="http://images.nationalgeographic.com/wpf/media-live/photos/000/234/overrides/tahoe-fluke-trail_23499_160x120.jpg">
  <p>Mercedes</p>
<a href="http://www5.mercedes-benz.com/en/">Купить</a>
    </div>
    </div>
        </li>

  </ul>

我试过这段代码

 jQuery(document).ready(function ($) { 

    var clicked;

    $('.wrapper').click(function(){

    clicked = $(this);
    clicked.find('img').fadeOut().trigger('click');
    });

    $('button.next').click(function(){
      clicked.next().find('img').fadeOut().trigger('click');   

       }); 
       }); 

DEMO

但是,当我完成我的代码停止。如果有人知道我怎么能转到下一个李,请告诉我。

我决定更新我之前的问题,以便更好地描述我需要达到的目标。

谢谢!

0 个答案:

没有答案