我有一个选择框性别，我想在更改此性别后更改其他字段的标签我答案

【问题标题】：I have a select box gender and I want to change the the label of other fields after changing of this gender i我有一个选择框性别，我想在更改此性别后更改其他字段的标签我
【发布时间】：2018-04-11 11:13:08
【问题描述】：

我有一个选择框的性别，我想在更改此性别后更改其他字段的标签

我的代码在这里

<label class="control-label col-sm-3">Gender</label>
<div class="col-sm-9">
    <select class="form-control" id="gender" name="gender" onchange="changelabel()">
        <option value="">Gender</option>
        <option <?php if($res['gender']=='Female'){?> selected="selected" <?php } ?> value="Female">Female</option>
        <option <?php if($res['gender']=='Male'){?> selected="selected" <?php } ?> value="Male">Male</option>
    </select> 

    <!-- Other fields are -->
    <div class="row">
        <div class="col-md-4">
            <div class="form-group">
                <label class="control-label col-sm-3"><span id="prtttl">Wife Title</span></label>
                <div class="col-sm-9">
                    <select class="form-control" id="partnerTtl" name="partnerTtl">
                        <option value="">Select</option>
                        <option <?php if($res['partnerTtl']=='Smt'){?> selected="selected" <?php } ?> value="Smt">Smt</option>
                        <option <?php if($res['partnerTtl']=='Late'){?> selected="selected" <?php } ?> value="Late">Late</option>
                    </select>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="form-group">
                <label class="control-label col-sm-3"><span id="prtnms">Wife Name</span> </label>
                <div class="col-sm-9">
                    <input type="text" name="hwname" value="<?php echo $res['partnerName'] ?>" placeholder="Husband/Wife Name" class="form-control">
                </div>
            </div>
        </div>

当用户选择男性时，如果用户选择性别女性，则妻子姓名的标签将相同，标签更改为丈夫姓名，这是使用 javascript 的任何可能方式

【问题讨论】：

这个代码是一团糟
为什么不直接用“配偶”这个词开头——然后结束它呢？额外的好处-自动消除可能的歧视问题（并且取决于将要部署的确切位置，可能遵循的法律诉讼），否则您将在这里通过“婚姻=一个男人+”的相当过时的假设来创建一个女人” ...
@cbroe 在这里！
@Anthony 听到了！

标签： javascript php jquery html onchange

【解决方案1】：

试试这个jquery

function changelabel()
    {
        if($("#gender").val() == 'Female')
        {
            $("#prtttl").text("Husband's Title");
            $("#prtnms").text("Husband's Name");
        }
        else
        {
           $("#prtttl").text("Wife's Title");           
           $("#prtnms").text("Wife's Name");
        }
    }

【讨论】：

伟大的@madhukanttiwari 接受相同的答案，但后一个而不是前一个

【解决方案2】：

试试onchange这样的活动

<script type="text/javascript">
        $(document).ready(function() {
            $('select').on('change', function() {
              data=this.value;
              if (data=='female') {
                $(".your class or Id").append('<span id="prtnms">Wife Name</span>');

              }
            })
        });
    </script>

【讨论】：

【解决方案3】：

编写你的 JS 函数如下：

<script>
function changelabel(){
  if($("#gender").val() == 'Female')
  {
     $("#prtttl").html("Husband Title");
     $("#prtnms").html("Husband Name");
  }
  else
  {
     $("#prtttl").html("Wife Title");
     $("#prtnms").html("Wife Name");    
  }
}
</script>

【讨论】：

【解决方案4】：

你可以这样做：

function changelabel() {
   if ($('#gender').val()== 'Female') {
       $('#prtnms').text('Husband Name')
   else
       $('#prtnms').text('Wife Name');
}

但是当您标记 jQuery 时，您可以这样做：

$("#gender").change(function() {
  if ($(this).val() == 'Female') {
       $('#prtnms').text('Husband Name')
   else
       $('#prtnms').text('Wife Name');
});

请注意，由于内容只是文本，我使用了text() 而不是html()

【讨论】：