Question

我已经写了一个下拉菜单，我希望在单击某个选项时触发功能。它还没有在任何浏览器上工作，所以我用一个简单的警报替换了第一个函数，但是它也没有触发。任何指针将不胜感激！

<select name="webmenu" id="webmenu">
<option value="UK" id="UK_button" title="assets/images/uk_flag.png" onclick="alert('You are clicking on me');">&nbsp;</option>
<option value="US" id="US_button" title="assets/images/us_flag.png" onclick="finalResultsUS()">&nbsp;</option>
<option value="EU" id="EU_button" title="assets/images/euro_flag.png" onclick="finalResultsEuro()">&nbsp;</option>
</select>

到目前为止，我根据回复对代码进行了一些更改（谢谢你们）

<select name="webmenu" id="webmenu">
<option value="UK" id="UK_button" title="assets/images/uk_flag.png" onchange="alert('You are clicking on me');">&nbsp;</option>
<option value="US" id="US_button" title="assets/images/us_flag.png" onchange="finalResultsUS()">&nbsp;</option>
<option value="EU" id="EU_button" title="assets/images/euro_flag.png" onclick="finalResultsEuro()">&nbsp;</option>
</select>

<script>
document.getElementById("webmenu").onchange = function() {alert('you clicked me');
}
</script>

但是我需要能够为每个特定选择启动不同的功能，而不是选择任何更改的一个功能。如果没有jquery，我怎么能这样做？

我可以使用：

document.getElementById("webmenu").onchange = function() {
alert(this.value)
return false
};

但是如何编写它以便单击美国选项（第二个选项）会触发美国功能，而不是仅仅触发警报？

Answer 1

您无法处理onclick上的option您需要处理select-> onchange。基本的Id函数调用

Answer 2

这个简化版的代码似乎有效：

<select name="webmenu" id="webmenu">
<option value="UK" id="UK_button" onclick="alert('You are clicking on me');">UK-clickme</option>
</select>

http://jsfiddle.net/0o1syz29/

您使用的浏览器/版本是什么？

Answer 3

我不认为click事件对'选项'

有效

您只能使用change

$('#webmenu').change(function(){

var temp=$(this).children(":selected").val();
switch(temp)
{
    case 'UK':
        alert('Hello UK');
        break;
    case "EU":
        alert("HEllo EU");
        break;
}

});

Working Fiddle

See also

Answer 4

这是一个只有javascript的解决方案。您可以更改每个功能中的代码以删除警报并替换为您的工作代码。

<强> Here is a working jsFiddle

<select name="webmenu" id="webmenu" onChange='changedFunction(this.value);'>
    <option value="UK" id="UK_button" title="assets/images/uk_flag.png">&nbsp;</option>
    <option value="US" id="US_button" title="assets/images/us_flag.png">&nbsp;</option>
    <option value="EU" id="EU_button" title="assets/images/euro_flag.png">&nbsp;</option>
</select>

changedFunction= function (val) {
    //console.log(val);
    switch (val) {
        case 'US':
            finalResultsUS();
            break;
        case 'UK':
            finalResultsUK();
            break;
        case 'EU':
            finalResultsEuro();
            break;
    }
};

finalResultsUS = function() {
    alert('You clicked on US');
};
finalResultsUK = function() {
    alert('You clicked on UK');
};
finalResultsEuro = function() {
    alert('You clicked on EU');
};

onClick不会启动功能

4 个答案: