提问者:小点点

从另一个输入字段的下拉列表中自动获取值


我有一个选择下拉列表来获取来自我公司不同部门的用户的邮件。 我想,当用户从下拉菜单中选择部门名称时,该部门的邮件地址将自动设置在下一个输入字段中。

<select class="form-control" id="mail_type" name="email_to" onChange="getMailtype(this.value)" required>
  <option value="support@mail.com" selected>Support</option>
  <option value="bill@mail.com">Billing</option>
  <option value="sales@mail.com">Sales</option>
 </select>

 <span id="mail_info">
 <input type="text" name="email" class="form-control" value="support@mail.com" readonly>
  </span>
           

因此,在这里我选择了一个选项,电子邮件输入字段将使用js自动获得值


共2个答案

匿名用户

获取输入并设置选择的值

null

function getMailtype(value) {
  document.querySelector("#mail_info input").value = value;
}
<select class="form-control" id="mail_type" name="email_to" onChange="getMailtype(this.value)" required>
  <option value="support@mail.com" selected>Support</option>
  <option value="bill@mail.com">Billing</option>
  <option value="sales@mail.com">Sales</option>
</select>

<span id="mail_info">
 <input type="text" name="email" class="form-control" value="support@mail.com" readonly>
  </span>

匿名用户

null

const getMailtype = (target) => {
  $("#mail_info > input[name='email'")[0].value = target.value;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select class="form-control" id="mail_type" name="email_to" onChange="getMailtype(this)" required>
  <option value="support@mail.com" selected>Support</option>
  <option value="bill@mail.com">Billing</option>
  <option value="sales@mail.com">Sales</option>
</select>

<span id="mail_info">
 <input type="text" name="email" class="form-control" value="support@mail.com" readonly>
  </span>