給定兩個是/否字段，當字段 1 值被選中“是”時，如何使用 JavaScript 使字段 2 值被選中“是”？

Question

如果字段 1 選中“是”，則字段 2 應選中“是”

這是我到目前為止一直在嘗試的：

字段 1：

<div class="entire">
<div class="col3"><label class="label-right">||FIELDTAG Field1||Question15||ENDFIELDTAG||&nbsp;</label></div>
<div class="col9"><input type="radio" name="Field1" id="Question15yes" value="Yes" onclick="Check()">Yes&nbsp;<input type="radio" name="Field1" value="No" onclick="Check()">No</div>

字段 2：

<div class="entire">
<div class="col3"><label class="label-right">||FIELDTAG Field2||Question16||ENDFIELDTAG||&nbsp;</label></div>
<div class="col9"><input type="radio" name="Field2" id="Question16yes" value="Yes" onclick="Check()">Yes&nbsp;<input type="radio" name="Field2" value="No" onclick="Check()">No</div>

我正在嘗試像下面這個 js 一樣簡單的東西，但我肯定錯過了一些東西。 任何幫助將不勝感激！

<script language="JavaScript">    
function Check()  {
$("#Question15yes").click(function(){
     if ($(this).is(':checked'))
     {
         $("#Question16yes").val("Yes");
     }
        }
      });
    }      
</script>

Answer 1

確保在頁面中包含 JQuery。

要綁定您的事件，您需要等待DOM完全加載，否則您將嘗試使用尚不存在的元素。

<script language="JavaScript">    
    $(function() {
      $(".question-checkbox").click(function(){
        if ($(this).is(':checked'))
        {
          console.log($(this));
        }
      });
    });     
</script>

此外，您可能希望將 JQuery 選擇器從 ID 更改為類，以便您可以對所有類似的復選框使用相同的代碼。

在輸入上放置一個.question-checkbox類，並刪除所有點擊。

Answer 2

將此用於具有類名“example”的單個復選框：

 $('input.example').on('change', function() {
  $('input.example').not(this).prop('checked', false);
 });

Answer 3

您不必在每次點擊時都調用check 。 文檔加載后，調用一次。

 window.addEventListener("load", function(){ $("input[type='radio']").on("click", function(){ if($("#Question15yes").is(':checked')) $("#Question16yes").prop("checked", true); }); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="entire"> <div class="col3"> <label class="label-right">||FIELDTAG Field1||Question15||ENDFIELDTAG||&nbsp;</label> </div> <div class="col9"> <input type="radio" name="Field1" id="Question15yes" value="Yes"> Yes&nbsp; <input type="radio" name="Field1" value="No" >No </div> <div class="entire"> <div class="col3"> <label class="label-right">||FIELDTAG Field2||Question16||ENDFIELDTAG||&nbsp;</label> </div> <div class="col9"> <input type="radio" name="Field2" id="Question16yes" value="Yes"> Yes&nbsp; <input type="radio" name="Field2" value="No"> No </div>