Question

我有一个foreach循环，我为每个作业打印出yes和no按钮。我想弄清楚的是当用户点击是时更改所选作业中的div。我想到的是当点击是时如何更改所有作业的div。我该怎么办才能改变这份工作呢？这是我的HTML

<div class = "interviewed-yes-no">
       <div>
           <input class="interview-yes" type="submit" value="Yes" style="background:none!important;color:#2AACEA;
                            border:none; padding:0!important;">
           <input type="submit" value="No" style="background:none!important;color:#2AACEA;
                            border:none; padding:0!important;font: inherit;padding-right: 10% !important;">
    </div>
 </div>
<div class ="date-of-interview" style="display: none;">
        <input id="interview-date" name="interview-date" placeholder="mm/dd/yyyy" type="bs-date" class="form-control" value="">
</div>

这是我的jquery

$(document).ready(function () {
        $(".interview-yes").click(function () {
            $('.interviewed-yes-no').hide();
            $('.date-of-interview').show();
        })
    });

Answer 1

不要使用常规选择器。而是使用 .parent（）和 .find（）来仅选择与该测验相关的元素。例如：

＆＃13;

$(document).ready(function () {
        $(".interview-yes").click(function () {
            $(this).parent().parent().find('.interviewed-yes-no').hide();
            $(this).parent().parent().find('.date-of-interview').show();
        })
    });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="question">
<div class = "interviewed-yes-no">
           <input class="interview-yes" type="submit" value="Yes" style="background:none!important;color:#2AACEA;
                            border:none; padding:0!important;">
           <input type="submit" value="No" style="background:none!important;color:#2AACEA;
                            border:none; padding:0!important;font: inherit;padding-right: 10% !important;">
 </div>
<div class ="date-of-interview" style="display: none;">
        <input id="interview-date" name="interview-date" placeholder="mm/dd/yyyy" type="bs-date" class="form-control" value="">
</div>
</div>
<div class="question">
<div class = "interviewed-yes-no">
           <input class="interview-yes" type="submit" value="Yes" style="background:none!important;color:#2AACEA;
                            border:none; padding:0!important;">
           <input type="submit" value="No" style="background:none!important;color:#2AACEA;
                            border:none; padding:0!important;font: inherit;padding-right: 10% !important;">
 </div>
<div class ="date-of-interview" style="display: none;">
        <input id="interview-date" name="interview-date" placeholder="mm/dd/yyyy" type="bs-date" class="form-control" value="">
</div>
</div>

＆＃13;

Jquery根据带有多个按钮的按钮单击更改div

1 个答案: