根据下拉列表更改视频在Jquery中

时间:2014-11-06 06:59:30

标签: javascript jquery html video

我正在尝试在更改下拉列表时使用Jquery更改视频src。

这是我的Jquery脚本代码,

<script type="text/javascript">
            $(document).ready(function(){
                $("#videoSelect").change(function() {
                var videoValue = $(this).val();

                if(videoValue==1){
                    console.log("Inside"+videoValue);
                    $("#video2").attr('src','video/1.mp4');
                }
                else if(videoValue==2){
                    console.log("Inside"+videoValue);
                    $("#video2").attr('src','video/2.mp4');
                }
                else{
                    console.log("Inside"+videoValue);
                    $("#video2").attr('src','video/3.mp4');
                }

            }); 
            });
</script>

这是我的HTML代码:

<tr>
    <td>
        <select id="videoSelect">
          <option value="1">Higher Education in India </option>
          <option value="2">Sardar Vallabh Bhai Patel</option>
          <option value="3">Maulana Abul Kalam Azad</option>
        </select>
    </td>
</tr>
<tr>
    <td>
        <video width="100%" height="202px" controls=""> 
            <source id="video2" src="video/Education In India.mp4" type="video/mp4">                       
            <object width="260" height="150" type="application/x-mplayer2">
                <param name="fileName" value="video/movie.swf">
                <param name="autostart" value="0">
            </object>
        </video>
    </td>
</tr>

看到的是代码工作正常并且选择下拉视频“src”属性值更改(因为我使用Inspect Element分析),但视频本身不会更改而是播放初始视频。

请帮我解决这个问题。

感谢。

1 个答案:

答案 0 :(得分:0)

把id =&#34; video2&#34;转到视频标签而不是源标签,然后就可以了。