Javascript onChange 下拉菜单
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15418951/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Javascript onChange dropdown
提问by Jeff
I am trying to call a javascript function onChange of an HTML Select.
我正在尝试调用 HTML 选择的 onChange javascript 函数。
HTML Doc:
HTML 文档：
<select name="network" onChange="test(this)">
<option value="net1">Net1</option>
<option value="net2">net2</option>
</select>
<script>
alert("test");
var URLArray = [];
function test(str){
alert("test");
}
</script>
I get the first alert, but not the second one. What am I missing?
我收到第一个警报，但没有收到第二个。我错过了什么？
EDIT: The code actually works, but for whatever reason, I cannot use the separate panes in JSFiddle. Any thoughts on that?
编辑：代码实际上有效，但无论出于何种原因，我都无法在 JSFiddle 中使用单独的窗格。对此有何想法？
采纳答案by magritte
When jsFiddle runs your code, it wraps it in a closure like this:
当 jsFiddle 运行您的代码时，它会将其包装在如下所示的闭包中：
<script type='text/javascript'>//<![CDATA[
window.onload=function(){
alert("test");
var URLArray = [];
function test(str){
alert("test");
}
}//]]>
</script>
So the function you defined "test", is never available as a global function, therefore not accessible by the inline javascript which you placed on the select tag.
因此，您定义的“test”函数永远不会作为全局函数使用，因此您放置在 select 标签上的内联 javascript 无法访问该函数。
I strongly suggest you learn to use jQuery instead to attach your event handlers like this:
我强烈建议您学习使用 jQuery 来附加您的事件处理程序，如下所示：
<select name="network">
<option value="net1">Net1</option>
<option value="net2">net2</option>
</select>
$(function () {
console.log("oh look, the document is ready");
$("[name=network]").change(function () {
console.log("now my code is groovy, but i might want to use an id rather than name selector");
});
});
回答by Panayot Karabakalov
Your script is Ok, you just put the same value ("test") for both alert.
您的脚本没问题，您只需为两者设置相同的值（“测试”）alert。
<script>
alert("test1");
var URLArray = [];
function test(str){
alert("test2");
}
</script>
Or maybe the final goal is this...
或者也许最终的目标是这个......
function test(elm){
alert(elm.value);
}
回答by Mehdi Karamosly
try to move your script above your first call like below:
尝试将您的脚本移动到您的第一个电话上方，如下所示：
<script>
alert("test");
var URLArray = [];
function test(str){
alert("test");
}
</script>
<select name="network" onChange="test(this)">
<option value="net1">Net1</option>
<option value="net2">net2</option>
</select>
This is the jsfiddleas you see I set the javascript to be put in the header.
这是jsfiddle，如您所见，我将 javascript 设置为放入标题中。
回答by Narxx
As Panayot said, your code is OK, but I'd rather use console.log()instead of alert. It's much easier to view on the console than following alerts.
正如 Panayot 所说，你的代码没问题，但我宁愿使用console.log()而不是alert. 在控制台上查看比跟踪警报要容易得多。
<select name="network" onChange="test(this)">
<option value="net1">Net1</option>
<option value="net2">net2</option>
</select>
<script>
console.log("test1")
var URLArray = [];
function test(str){
console.log("test2");
}
</script>
