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

时间:2013-10-13 05:17:44

标签: javascript html google-chrome video safari

我的博客上有一个视频转换器,可以使用onclick在youtube上更改视频。但是使用Safari&amp;中的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>

1 个答案:

答案 0 :(得分:3)

在线演示: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>