Question

我有一个选择，我想运行一个不同的javascript函数，具体取决于他们在菜单中单击时选择的内容。我的谷歌搜索一直没有用，有人能指引我到正确的房产吗？（例如，我知道onclick适用于按钮）。在此先感谢您的帮助！

编辑：onchange在我的代码中不起作用。

<head>
    <script>
        function goToDelete(){
            document.write("Death to this webpage!")
        }
    </script>
</head>
<form id="checkboxes" method="post" action="someurl">
    <tr>
        <td><input type="checkbox" name="Selection"/></td>
        <td>Some more rows to the table here</td>
    </tr>
    <select name="action">
        <option value="Delete" onchange="goToDelete()">Delete</option>
    </select>

Answer 1

我建议使用change / onchange事件，但这只会在用户选择之前未选择的option时触发（因此名称）。

简要演示了如何使用change（在Chrome 27 / Windows XP中测试过）：

var select = document.getElementById('demo');

function logValue() {
    switch (this.value) {
        case '1':
            console.log('option 1 selected');
            break;
        case '2':
            alert('option 2 selected');
            break;
        case '3':
            confirm('You chose option 3, didn\'t you?');
            break;
    }
}

select.addEventListener('change', logValue, false);

JS Fiddle demo

请务必注意，change / onchange事件必须绑定到select元素not the option elements。 option本身不会更改，选择触发更改。

参考文献：

change。

Answer 2

我建议您开启和关闭jQuery，如下所示：

$('body').on('change', '#yourSelectId', function(){
      // do what you need
});

Answer 3

function SelectedValue(sel) {
    var value = sel.options[sel.selectedIndex].value;  
    //Do something depending on value
}
<select id="myid" onchange="SelectedValue(this)">
    <option value="">Select options</option>
    <option value="Value1">Text1</option>
    <option value="Value2">Text2</option>
    <option value="Value3">Text3</option>
</select>

Answer 4

来自jQuery的

change function()将帮助您做到这一点：

$(document).ready(function(){
$("#yourselectInput").change(function(){

alert("item had change!!");

})
})

实例

http://jsbin.com/unujiz/1/edit

如何检测用户何时点击下拉菜单中的选项（选择标记）

4 个答案: