jquery如何從外部查找元素

Question

我想找到一個元素，這是我試圖單擊的元素之外。

我需要點擊＃form-1和slideToggle .business-form-kaufen。 您可以在圖片中查看層次結構。

感謝您的幫助！

Answer 1

使用.parent()相對

$("#form-1").on("click", function(evt) { 
 
    $(this).parent().parent().next().find(".business-form-kaufen").slideToggle(); 
 
});

.business-form-kaufen { 
 
    display: none; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="col-md-12 text-left"> 
 
    <div id="kaufen-form-submit"> 
 
    <a id="form-1">Unverbindliches ...</a> 
 
    </div> 
 
</div> 
 
<div id="wpcf7-fp09-p448-ol"> 
 
    <div class="screen-reader-response"></div> 
 
    <form> 
 
    <div class="business-form-kaufen"> 
 
     Lorem ipsum dolor sit amet 
 
    </div> 
 
    </form> 
 

 
</div>

或者，如果你可以編輯你的HTML一些id添加到.business-form-kaufen或者確保它是僅此單一元素你可以做得更簡單：

$("#form-1").on("click", function(evt) { 
 
    $(".business-form-kaufen").slideToggle(); 
 
    // $("#business-form-kaufen").slideToggle() uncomment if you can setup unique id on this element 
 
});

.business-form-kaufen { 
 
    display: none; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="col-md-12 text-left"> 
 
    <div id="kaufen-form-submit"> 
 
    <a id="form-1">Unverbindliches ...</a> 
 
    </div> 
 
</div> 
 
<div id="wpcf7-fp09-p448-ol"> 
 
    <div class="screen-reader-response"></div> 
 
    <form> 
 
    <div class="business-form-kaufen"> 
 
     Lorem ipsum dolor sit amet 
 
    </div> 
 
    </form> 
 

 
</div>

Answer 2

你需要從按鈕走了兩個DIV水平，然後進入下一個DIV，並在那裏找到.business-form-kaufen。

$(".button").click(function() { 
    $(this).parent().parent().next().find(".business-form-kaufen").slideToggle(); 
}); 

Answer 3

我認爲form和business-form-kaufen是1對1間的關係？我把它們放在一個容器中，然後用parents()找到容器，然後用find()查找business-form-kaufen。

這樣，代碼足夠智能，無需硬編碼DOM結構即可查找business-form-kaufen。