Question

我有多次相同的div。如果我点击第一个div字段中的'Mr'单选按钮应该将最后一个div单选按钮值更改为'male'这里是我的代码。它将所有div值更改为'male'。如何单击标题单选按钮时更改相关表单性别单选按钮值。请任何人帮助我。

<?php
    for($i=1;$i<=$totalchilds;$i++){
    ?>
        <div class="primary Applicant-details">
          <h3>Tourist Details </h3>
            <div>
              <label>Title : </label>
              <input type="radio" class="gender" name="c_genderinfo_<?=$i?>" value="Mr" checked>
              Mr
              <input type="radio" class="gender1" name="c_genderinfo_<?=$i?>" value="Mrs">
              Mrs </div>
            <div>
              <label for="fname">Name</label>
              <input type="text" name="c_name_<?= $i ?>" placeholder="child name">  
            </div>
            <div>
              <label for="lname">Age</label>
              <input type="text"  name="c_age_<?=$i?>" placeholder="Enter child age">
            </div>
            <div>
              <label>Gender : </label>
              <input type="radio" class="gender" name="c_gender_<?=$i?>" value="M" checked>
              Male
              <input type="radio"  class="gender1" name="c_gender_<?=$i?>" value="F">
              Female </div>
        </div>

    <?php }?>

Answer 1

要更改同一div中的性别单选按钮，请使用以下代码：

$('.gender').click(function(){
    $(this).closest('.Applicant-details').find('.gender').prop('checked',true);
});
$('.gender1').click(function(){
    $(this).closest('.Applicant-details').find('.gender1').prop('checked',true);
});

代码的结构不是很理想。将标题从性别重命名为标题。命名单选按钮性别和 gender1 并不是更好。此外，从可用性的角度来看，两个具有相同值的选择都没有多大意义。

Answer 2

您可以使用jQuery。有不同的方法来实现这一目标。这是其中之一。从html传递你的id和值，如下所示：

<div>
    <label>Title : </label>
    <input onclick="changeGender(<?=$i?>, 'M')" type="radio" class="gender" name="c_genderinfo_<?=$i?>" value="Mr" checked>
    Mr
    <input onclick="changeGender(<?=$i?>, 'F')" type="radio" class="gender1" name="c_genderinfo_<?=$i?>" value="Mrs">
    Mrs 
</div>

在剧本中：

function changeGender(id, value)
{
    $("input[name=c_gender_"+id+"][value=" + value + "]").prop('checked', true);
}

单击另一个单选按钮可更改动态单选按钮值

2 个答案: