如何在 html <select> 中使用 onclick 事件
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/19342112/
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
how to use onclick event in html <select>
提问by user2875405
I have a video changer on my blog that can change videos on youtube using onclick. But that does't work using the select tag in Safari & Chrome.
我的博客上有一个视频转换器，可以使用 onclick 更改 youtube 上的视频。但这在 Safari 和 Chrome 中使用 select 标签不起作用。
I've read a bunch of other questions on how to do this but am having no luck in converting this to work using onchange with the select tag.
我已经阅读了很多关于如何执行此操作的其他问题，但是我没有运气将其转换为使用 onchange 和 select 标签工作。
I am new to javascript.
我是 javascript 新手。
BTW, I have not gotten this to work when plugged into jsfiddle, pastebin, or any other service.
顺便说一句，当插入 jsfiddle、pastebin 或任何其他服务时，我还没有让它工作。
But it does work if your paste it into http://htmledit.squarefree.comTry clicking on the different movie names to see what I mean.
但如果您将其粘贴到http://htmledit.squarefree.com 中，它确实有效尝试单击不同的电影名称以了解我的意思。
But basically, I need this to work with the select tag, instead of span tag.
但基本上，我需要它来处理 select 标签，而不是 span 标签。
<div id='Trailer5' style='display:none'><iframe width='700' height='430' src='http://www.youtube-nocookie.com/embed/vEO9iLWBWvw?theme=light&version=3&rel=0&ps=blogger&iv_load_policy=3&showinfo=0' frameborder='0' allowfullscreen></iframe><h3>July 12th, 2013</h3></div>
<div id='Trailer10' style='display:none'><iframe width='700' height='430' src='http://www.youtube-nocookie.com/embed/Fkbm8a40TC4?theme=light&version=3&rel=0&ps=blogger&iv_load_policy=3&showinfo=0' frameborder='0' allowfullscreen></iframe><h3>June 20th, 2014</h3></div>
<span onclick='return playVideo("Trailer5","videoPlayback")'>Terms and Conditions may Apply</span><br/>
<span onclick='return playVideo("Trailer10","videoPlayback")'>How to Train your Dragon 2</span>
<div id='videoPlayback'><iframe width='700' height='430' src='http://www.youtube-nocookie.com/embed/Fkbm8a40TC4?theme=light&version=3&rel=0&ps=blogger&iv_load_policy=3&showinfo=0' frameborder='0' allowfullscreen></iframe></div></br><h3>Movie "in Theaters" Date Shown Here</h3></div>
<script type='text/javascript'>function playVideo(a,b){"string"==typeof a&&(a=document.getElementById(a));"string"==typeof b&&(b=document.getElementById(b));b.innerHTML=a.innerHTML;return!1}</script></div>
回答by thefourtheye
Online Demo: http://jsfiddle.net/thefourtheye/GP5HE/
在线演示：http: //jsfiddle.net/thefourtheye/GP5HE/
Instead of the SPAN tags, you can use this
代替 SPAN 标签，您可以使用它
<select onChange="playVideo(this)">
<option value="Trailer5">Terms and Conditions may Apply</option>
<option value="Trailer10">How to Train your Dragon 2</option>
</select>
And the script has to be modified like this
并且脚本必须像这样修改
<script type='text/javascript'>
function playVideo(a)
{
a = document.getElementById(a.value);
b = document.getElementById("videoPlayback");
b.innerHTML = a.innerHTML;
}
</script>
