如果孩子跨度上課，則顯示父母DIV

Question

我試圖弄清楚為什么這不起作用。 我有一個div ，如果它有一個或多個span子類別為.reqiredError的類，則希望將其切換為打開.reqiredError 。

參見JSFiddle

<div class="more-content" style="display:none;">
    <div class="col-xs-5 form-group">
        <label for="dua-status">
            Status: 
            <span class="required">*</span> 
            <span class="requiredError">Required Field</span>
        </label>
        <select id="dua-status">
            <option>Open</option>
        </select>
    </div>
</div>

$(document).ready(function() {
    if ($('span').hasClass('requiredError')) {
        $(this).closest().parent('div.more-content').fadeIn(0);
    }
});

Answer 1

您不需要if語句。

相反，使用：has（）將它們作為選擇器的目標。 這樣做的好處是您不必導航到父級，因為上下文將是具有這些范圍的父級div。

 $(document).ready(function() { $('div.more-content:has(.requiredError)').fadeIn(0); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div class="more-content" style="display:none;"> <div class="col-xs-5 form-group"> <label for="dua-status">Status: <span class="required">*</span> <span class="requiredError">Required Field</span> </label> <select id="dua-status"> <option>Open</option> </select> </div> </div> 

Answer 2

您可以找到目標元素，然后使用.closest（）找到目標祖先元素

 $(document).ready(function() { $('.requiredError').closest('.more-content').fadeIn(0); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div class="more-content" style="display:none;"> <div class="col-xs-5 form-group"> <label for="dua-status">Status: <span class="required">*</span> <span class="requiredError">Required Field</span> </label> <select id="dua-status"> <option>Open</option> </select> </div> </div> 

最近與