jQuery 没有针对我需要的 div

Question

我确定这很简单，但我想不出如何让它工作。我试过 .next() 和 .nextAll() 无济于事。我唯一能想到的是我正在尝试的功能由于代码流而无法正常工作。无论如何，下面是适合您的 jquery 和 html。我只是想让表单框在单击下载时淡入。

HTML:

                 <div class="pdfs">
                    <div class="pdf-left">
                        <div class="image">
                            <img src="images/pdfs/macrolux/1.jpg" width="100" height="79">
                        </div>
                        <div class="text">
                            <div class="view">View</div>
                            <div class="download">Download</div>
                        </div>
                    </div>
                    <div class="pdf-right">
                        <div class="image">
                            <img src="images/pdfs/macrolux/2.jpg" width="100" height="79">
                        </div>
                        <div class="text">
                            <div class="view">View</div>
                            <div class="download">Download</div>
                        </div>
                    </div>
                </div>
                <div class="form-box">
                    Form
                </div>

jQuery:

$(document).ready(function(){
    $('div.download').on('click', function(){
        $(this).next('div.form-box').fadeIn('slow');
    });
});

Answer 1

This如果您没有多个 div.form-b​​ox

应该就足够了

$(document).ready(function(){
  $('div.download').on('click', function(){
      $('div.form-box').fadeIn('slow');
  });
});

如果在每个 pdfs div 之后都有 div.form-b​​ox :

$(document).ready(function(){
    $('div.download').on('click', function(){
        $(this).parents('.pdfs').next('div.form-box').fadeIn('slow');
    });
});

DEMO