带有onclick动作的检查按钮

Question

我有一个包含问题列表的表单，其中一个问题是一个复选按钮，有一个是和没有值，我们希望如果用户选择是，将显示另一个问题是用文本框隐藏吗？ 使用 JavaScript

这是我的代码

                <div class="col-md-6">
                  <div class="row">
                    <div class="col-md-3">
                      <img alt="" src="images/factor.jpg">
                    </div><!-- /.col -->
                    <div class="col-md-9 editContent"><h5 style= "font-size: 18px ;font-weight: bold ">Is journal has an impact factor or not?</h5>

                      <p><input type="radio" name="impact" value="1"/>Yes<br>
                        <input type="radio" name="impact" value="0" required/>No</p>
                      </div><!-- /.col -->
                    </div>
                </div><!-- /.col -->

                <div class="col-md-6">
                  <div class="row">
                    <div class="col-md-3">
                      <img alt="" src="images/factor.jpg">
                    </div><!-- /.col -->
                       <div class="col-md-9 editContent"><h5 style= "font-size: 18px ;font-weight: bold ">Determine the impact factor of journal if there is one:</h5>

                        <p><input type="number"  min="0" max="3"  value="0.000" step="0.001"
                            name="factornumber" required/></p>
                        </div>
                  </div>
                </div><!-- /.col -->
      </div><!-- /.row -->

Answer 1

在这个块中：

<div class="col-md-9 editContent"><h5 style= "font-size: 18px ;font-weight: bold ">Is journal has an impact factor or not?</h5>

                      <p><input type="radio" name="impact" value="1" class="yes"/>Yes<br>
                        <input type="radio" name="impact" value="0" required/>No</p>
                      </div><!-- /.col -->
                    </div>

您必须将checked 属性添加到两个输入之一，让我们将其添加到No 上，因此默认情况下答案中将是No，就像这样

<input type="radio" name="impact" value="0" checked />No</p>

并在您的 HTML 代码中为第二个问题名称添加一个 id，例如“seconQuest”，在您的 JS 代码中，它将与此类似

    var answer;
    $("input.yes").is(":checked") ? answer = 'YES' : answer = 'no';
    if(answer === 'YES'){
      $("div#secondQuest").show();
    }

注意：第二个 div 将类似于：

<div class="col-md-6" id="secondQuest">
                  <div class="row">
                    <div class="col-md-3">

希望它有所帮助