0

当用户单击下拉菜单中的<option>某个选项时,有没有办法执行 javascript 函数?<select>

4

7 回答 7

3

<select>元素支持onchange事件。

http://w3schools.com/jsref/event_onchange.asp

于 2012-04-03T23:19:54.697 回答
2

您的 HTML 将如下所示:

<select onchange="functionName(this.value)">
    <option value="1"> 1 </option>
    <option value="2"> 2 </option>
    <option value="3"> 3 </option>
</select>​

在您的 JavaScript 中,您将拥有一个函数 ( ex: functionName()),并且您将使用该函数来测试每种情况。

于 2012-04-03T23:26:41.863 回答
2

这里:

elem.onclick = function ( e ) {
    if ( e.target.tagName.toLowerCase() === 'option' ) {
        // an <option> element was clicked
        // do your thing
    }
};

elem您的 SELECT 元素在哪里。

现场演示:http: //jsfiddle.net/vBB7a/

于 2012-04-04T00:07:29.027 回答
1

您可以使用该change事件来检查用户单击了哪个选项,然后执行您想要的代码。

在jQuery中:

$('#yourSelect').change(function(){
    var item = $(this).val();

    if (item === "Specified Choice")
    {
        //do your stuff here
    }
});
于 2012-04-03T23:19:58.063 回答
0

您需要挂钩元素的onchange事件<select>,并检查值。你试过吗?

于 2012-04-03T23:23:55.260 回答
0

在您的内部,您<option>可以使用该onclick事件来指定要执行的 javascript 函数。

例如

<option onclick="yourFunction()">
于 2012-04-03T23:24:59.233 回答
0

在您的项目中使用 Jquery..

HTML 代码:

<select id="myselect">
    <option value="">Select</option>
    <option value="1">StactOverFlow</option>
    <option value="2">SuperUser</option>
    <option value="3">Another 1</option>
    <option value="4">Another 2</option>
    <option value="5">Another 3</option>
</select>

jQuery代码:

$("#myselect").bind('change', function(){
    switch($(this).val()){
        case "1":
            click_action_1();
            break;

        case "2":
            click_action_2();
            break;

        case "3":
            click_action_3();
            break;
    }
});

function click_action_1(){
    alert('Hi 1');
}         

function click_action_2(){
    alert('Hi 2');
}      

function click_action_3(){
    alert('Hi 3');
}
​

您甚至可以使用<option> Watch in Action 执行新的 javascript 函数:http: //jsfiddle.net/extremerose71/PnfCk/8/

享受!...

于 2012-04-03T23:49:18.717 回答