jquery - 如何放置选择列表的onchange事件？

Question

我已经准备好解决我的下一个问题了。我有一个选择列表，填充如下：

<select id= "tables" name= "tables">
    <option value="select">-- Select --</option>
    <option value = student> Student</option>
    <option value = teachers > Teachers </option>
    //etc..
</select>

在选择列表的 onchange 事件中，会填充另一个选择列表。

我的第一个问题是当我选择一个项目时，比如“学生”，视图仍然保留在“选择”选项上。我希望它应该显示我选择的项目。

我的第二个查询是，如果我不写“-- 选择--”和“学生是第一项”，那么当我第一次单击学生时，没有任何反应意味着第二个选择列表不会被填充。

请帮忙！

Answer 1

更改事件

$('#tables').change(function(){
    alert('change: ' + $(this).val())
})

演示：小提琴

Answer 2

假设你的 html 是这样的：

<select id= "tables" name= "tables">
    <option value="">-- Select --</option><!-- setting the value to none -->
    <option value = student> Student</option> 
    <option value = teachers > Teachers </option>
</select>

使用 jQuery，它将成为change事件：

$('#tables').on('change', function(e) {
    var value = $(this).val();

    if(value.length != 0) {
        alert(value);
    }

});

那里有一个活生生的例子。

Answer 3

这是你想要的吗，FIDDLE

代码

<select id= "tables" name= "tables">
    <option value="">-- Select --</option><!-- setting the value to none -->
    <option value = "student"> Student</option>
    <option value =" teachers" > Teachers </option>
</select>

<select id= "tables2" name= "tables">
    <option value="">-- Select --</option>
    <option value = student> Student</option>
    <option value = teachers > Teachers </option>
    //etc..
</select>

JAVASCRIPT代码

$(function(){
    $('#tables').on('change', function(e) {
        $('#tables2').val(this.value);
    });
})

Answer 4

希望这会有所帮助：

   $('#tables').change(function(){
     var selectedVal = $(this).val();
     alert(selectedVal);
   })