javascript - 不要使用 Jquery 获取适当的 div

Question

当有很多同名的 div 时，我需要从多个 div 中显示一个 div -

我想像面板一样- http://www.estalote.com/est_fix/est_web_calc.php

我的 Html-Php 代码--

<?php 
    for($i=0; $i < 6; $i ++)
    {
    ?>
    <div class="section">
        <div class="section_top" align="right">
            <button class="press"> + </button>
        </div>
        <div class="section_mid">
                <p style="padding-bottom:10px;color:BLUE;"><b><font size="3">Rhojhsdkjf</font></b></p>
                <p><input type="radio" name="same"/> Database value 1</p>
                <p><input type="radio" name="same"/> Database value 2</p>
                <p><input type="radio" name="same"/> Database value 3</p>
                <p><input type="radio" name="same"/> Database value 4</p>
            <div class="cleaner"></div>
        </div>
        <div class="section_bottom">
        </div>
    </div>     
    <?php
    }
    ?>

我的 jQuery 代码--

<script type="text/javascript">
    $(document).ready(function(){
        $( ".press").click(function() {
            $(".section_mid").css("height", "20px");            
            $(".section_mid", this).css("height", "auto");
        });
    });
</script>

默认情况下，div 的高度为 20px，当我点击按下按钮时，我需要显示完整的高度。

现在怎么办？？
请帮助我...
提前致谢。

Answer 1

section_mid 不是 press 的子项，因此您的代码无法正常工作。您需要正确遍历 DOM。

使用

$(this).closest('.section').find(".section_mid").css("height", "auto");

代替

$(".section_mid", this).css("height", "auto");

引用资料

1. .closest()
2. .find()