javascript - 如何使用 jQuery 从 onchange 中选择输入值？

Question

我有一个选择和输入标签。我正在根据 select 标记中选择的内容更新文本输入的值。

选择标签

<select class="form-control form-field-username form-field-users">
<option class="form-field-first-option" value="0" selected="selected">Select User...</option>
<option value="1">Peter Fel</option> 
<option value="2">Mark Getty</option>
</select>

输入标签

<input name="user_id" id="user_id" class="form-control form-field-user-id" type="number">

onchange 选择代码:

$('.form-field-username').change( function() {
    $(this).find(":selected").each(function () {
        var userId = $(this).val();

        $('.form-field-user-id').val(userId);

    });

});

如果 onchange 选择第一个值或 user_id == 0，我想将用户 ID 为“user_id”的文本输入的值设置为 null 或 undefined。

你知道怎么修改代码吗？任何帮助表示赞赏。谢谢

Answer 1

使用 ternary operator 检查处理程序中的值. each()方法在这里完全没有必要，因为只有一个选择的选项。

$('.form-field-username').change(function() {
  $('.form-field-user-id').val(this.value == 0 ? '' : this.value);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="form-control form-field-username form-field-users">
<option class="form-field-first-option" value="0" selected="selected">Select User...</option>
<option value="1">Peter Fel</option> 
<option value="2">Mark Getty</option>
</select> 
<input name="user_id" id="user_id" class="form-control form-field-user-id" type="number">