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