javascript - 选择 HTML 选择/下拉列表中的项目时会触发什么事件?

标签 javascript html jquery

我想响应用户在 select 元素中选择一个项目。然而这个 jQuery:

$('#platypusDropDown').select(function () {
    alert('You selected something');
});

...什么都不做。它没有显示警报,尽管 jsFiddle 将其视为有效的 jQuery。

Click 事件有效,但速度太快 - 它会在进行选择之前点击选择元素时触发。

当然,我真的很想做这样的事情:

$('#platypusDropDown').select(function () {
    var selection = $('platypusDropDown').val;
    $.getJSON('platypus.json', selection, data() {
        // . . .
    });
});

HTML:

<select id="platypusDropDown">
    <option value="duckbill">duckbill</option>
    <option value="duckbillPlatypus">duckbillPlatypus</option>
    <option value="Platypus">Platypus</option>
    <option value="Platypi">Platypi</option>
</select>

最佳答案

您需要使用 change 事件

$('#platypusDropDown').change(function () {
    var selection = this.value; //grab the value selected
    $.getJSON('platypus.json', selection, data() {
    . . .
    });
});

Fiddle

加上 $('platypusDropDown').val 这里的 val 应该是 val() 并且你不需要在元素上再次创建一个 jquery 对象,处理程序中的 this 表示 DOM 元素(选择事件绑定(bind)到的元素),您可以使用 this.value$(this).val( )

关于javascript - 选择 HTML 选择/下拉列表中的项目时会触发什么事件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17414390/

相关文章:

html - 如何使用 .htaccess 从同一 URI 提供单独的移动和桌面页面?

jquery - 窗口大小调整时隐藏的响应式菜单

javascript - 索环与 create-react-app 集成

javascript - 如何 promise Cordova 文件插件?

html - 有没有办法使用应用程序脚本将 html 文本保存到谷歌驱动器中的文件?

jQuery 验证返回 : Object [object Object] has no method 'validate'

javascript - 如何使用 Javascript 或 jQuery 将一个对象的属性复制到另一个对象而不添加属性?

javascript - 无法清除 jQuery 中的下拉值

javascript - Node ffi : Dynamic Linking Error

python - 在 Flask 中使用 'action' 重定向到动态 URL 时出现问题