基于selectlist选项更新输入字段

问题描述

| 我有以下HTML

<select name=\"title\" id=\"title\">
  <option value=\"Mrs\" >Mrs</option>
  <option value=\"Mr\" >Mr</option>
  <option value=\"Miss\" >Miss</option>
  <option value=\"Dr\" >Dr</option>
</select>

<input type=\"text\" name=\"gtitle\" id=\"gift_title\" value=\"\" />

现在默认情况下，“ 1”显示为选择列表的第一个选项。然后，我需要获取此值并将其显示在“ 2”字段中。用户随后的选择，即他/她选择了“ 3”，也必须更新此输入字段。 我希望可以在jQuery中使用此功能，但不确定如何获取这些值。 谢谢     

解决方法

        您可以订阅下拉列表的the4ѭ事件并更新输入的值：

$(function() {
    // initialize the value of the input field to the selected value
    // of the dropdown list:
    $(\'#gift_title\').val($(\'#title\').val());

    $(\'#title\').change(function() {
        // when the value of the dropdown list changes
        // update the input field
        $(\'#gift_title\').val($(this).val());
    });
});

这是一个现场演示。     ,        除了已经提供的遮阳篷外，我建议以下内容在加载时使用复选框的默认值填充输入字段。 在Darin的代码的第4行和第5行之间插入这样的内容：

$(\'#gift_title\').val($(\'#title\').val());

或考虑使更改回调函数明确，以便可以重用。 希望这可以帮助！     ,        

<select name=\"title\" id=\"title\">
  <option value=\"Mrs\" >Mrs</option>
  <option value=\"Mr\" >Mr</option>
  <option value=\"Miss\" >Miss</option>
  <option value=\"Dr\" >Dr</option>
</select>

<input type=\"text\" name=\"gtitle\" id=\"gift_title\" value=\"Mrs\" />

我在html中添加了默认值

$(\'#title\').change(function(){
    $(\'#gift_title\').val(this.value);
});

工作演示 但是我看不到任何原因，只要在提交时使用选择值，就不需要输入字段