单选按钮为“是”时需要填写字段，“否”时不需要填写

Question

我已在此网站上搜索并尝试了所有建议，但在单选按钮上选择“否”时无法获得不需要的文本字段。

目前，如果“是”和“否”未选中，则文本字段不是必需的，因此将提交表单。 但是，如果任何一个字段都被选中，那么即使是“否”也需要它:-(

我这里有演示：https://jsfiddle.net/ba9ahpyx/

我只希望在“field_1”单选按钮上选择“是”时需要输入“field_2”。

I will be hiding the text field when 'No' is selected but have removed that code for now to keep it simple.

HTML

<form method="post" action="#">
<div>
  <div class="radio">
    <span class="label">Do you have your own website? (required)</span>
      <div>
        <label><input type="radio" name="field_1" value="Yes"> Yes</label>
        <label><input type="radio" name="field_1" value="No"> No</label>
      </div>
  </div>
</div>

<div>
  <label for="field_2">Website URL </label>
  <input type="text" name="field_2" id="field_2" value="" />
</div>

<div>
  <input type="submit" value="Submit">
</div>  
</form>

jQuery

$(document).ready(function(){
    $('input[name="field_1"]').change(function () {
        if(this.checked) {
            $('#field_2').prop('required',true);
        } else {
            $('#field_2').prop('required',false);
        }
    });
});

感谢您的帮助。

Answer 1

使用以下更改 jquery，它将为您工作

$(document).ready(function(){
    $('input[name="field_1"]').change(function () {
        if($(this).val() =='Yes') {
            $('#field_2').prop('required',true);
        } else {
            $('#field_2').prop('required',false);
        }
    });
});