onClick获胜't启动功能

onClick won't fire up functions

本文关键字:启动 功能 获胜 onClick      更新时间:2023-09-26

我已经编写了一个下拉菜单,希望在单击某个选项时激发函数。它在任何浏览器上都不起作用,所以我用一个简单的警报替换了第一个功能,但也没有启动。任何建议都将不胜感激!

<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
};

但我该如何写它,以便点击美国选项(第二个选项)会触发美国功能,而不仅仅是发出警报?

您不能在option上处理onclick您需要在select-> onchange上处理。基本的Id调用,用于

您的代码的简化版本似乎可以工作:

<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/

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

我认为click事件在'option'上无效

你所能做的就是使用change

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

工作Fiddle

另请参见

这里有一个只使用javascript的解决方案。您可以更改每个函数中的代码以删除警报并替换为您的工作代码。

这是一个正在工作的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');
};