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();
    }

注意：sencond div与此类似：

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

希望有所帮助

检查按钮与动作onclick

1 个答案: