如何在 html <select> 中使用 onclick 事件答案

【问题标题】：how to use onclick event in html <select>如何在 html <select> 中使用 onclick 事件
【发布时间】：2013-10-13 05:17:43
【问题描述】：

我的博客上有一个视频转换器，可以使用 onclick 更改 youtube 上的视频。但这在 Safari 和 Chrome 中使用 select 标签是行不通的。

我已经阅读了很多关于如何执行此操作的其他问题，但我没有运气将其转换为使用带有 select 标记的 onchange 工作。

我是 JavaScript 新手。

顺便说一句，当我插入 jsfiddle、pastebin 或任何其他服务时，我还没有让它工作。

但如果您将其粘贴到http://htmledit.squarefree.com 中，它确实有效。尝试单击不同的电影名称以了解我的意思。

但基本上，我需要它来处理 select 标签，而不是 span 标签。

<div id='Trailer5' style='display:none'><iframe width='700' height='430' src='http://www.youtube-nocookie.com/embed/vEO9iLWBWvw?theme=light&amp;version=3&amp;rel=0&amp;ps=blogger&amp;iv_load_policy=3&amp;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&amp;version=3&amp;rel=0&amp;ps=blogger&amp;iv_load_policy=3&amp;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&amp;version=3&amp;rel=0&amp;ps=blogger&amp;iv_load_policy=3&amp;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>

【问题讨论】：

标签： javascript html google-chrome video safari

【解决方案1】：

在线演示：http://jsfiddle.net/thefourtheye/GP5HE/

您可以使用它来代替 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>

而且脚本必须这样修改

<script type='text/javascript'>
    function playVideo(a)
    {
        a = document.getElementById(a.value);
        b = document.getElementById("videoPlayback");
        b.innerHTML = a.innerHTML;
    }
</script>

【讨论】：