Question

当我想在此HTML设置中找到元素时，我可以使用哪个选择器？不能使用.next，因为JQuery必须在HTML中更深入。

我尝试过滤，找到，孩子，但没有任何作用 - 我必须在某处做错事。

JQuery的

$('.btn').click(function(){
        $(this).next('.show_wrap').show(100); // .next NOT WORKING
});

HTML

<div class="h1_blue">
    <div class="h1_darker"></div>
        <h1>1</h1>
            <div class="btn" style="float: right"> SHOW </div>  
</div> <!--END OF h1_blue - THIS IS NEXT IN JQUERY ?? -->
<div class="pre_hide"> 
    <div class="show_wrap">
        <h1> content 1 </h1> 
    </div> <!-- END OF show_wrap -->    
</div> 

<div class="h1_blue">
    <div class="h1_darker"></div>
        <h1>2</h1>
            <div class="btn" style="float: right"> SHOW </div>  
</div> <!--END OF h1_blue - THIS IS NEXT IN JQUERY ?? -->
<div class="pre_hide"> 
    <div class="show_wrap">
        <h1> content 2 </h1> 
    </div> <!-- END OF show_wrap -->    
</div>

Answer 1

您正在使用错误的jquery选择器组合。使用：

 $('.btn').click(function(){ 
  $(this).closest('.h1_blue').next().find('.show_wrap').show(100); 
 });

Answer 2

您可以使用：

$('.btn').click(function(){
    $(this).closest('.h1_blue').next().find('.show_wrap').show(100);
});

Answer 3

这应该有效 -

$('.btn').click(function(){
     $(this).closest('div.h1_blue').next().find('.show_wrap').show(100);
});

Answer 4

试

$('.btn').click(function(){
    $(this).parents(".h1_blue").next().find('.show_wrap').show(100); // .next NOT WORKING
});

如何使用JQuery从HTML中选择元素

4 个答案: