1

我有一个视频库，需要我能够通过单击换出 mp4 的 href 和替代 ogv 视频文件，然后将新源加载到页面。

我编写的脚本在 Firefox 中完美运行，但在 IE 或 Chrome 中却不行。

我检查了变量是否正在填充，我尝试将缓存设置为 false 并使用随机字符串附加 url，但仍然没有乐趣。

这是脚本：

//Click and Hover events for thumbnail list
$(".video_thumb ul li:first").addClass('active'); 

$(".video_thumb ul li").click(function(){ 
    //Set Variables
    var vidAlt = $(this).find('img').attr("alt"); //Get Alt Tag of Image
    var vidSrc = $(this).find('a').attr("href"); //Get video link href
    var vidAltSrc = vidSrc.replace(".mp4", ".ogv"); //Create 2nd variable with alternate source

    if ($(this).is(".active")) {  //If it's already active, then...
        return false; // Don't click through
    } else {
        //Swap out video links  
    $('#vid video source#video1').attr('src', vidSrc);
        $('#vid video source#video2').attr('src', vidAltSrc);
        $('#vid video').attr('title', vidAlt);
        $('#vid video').load(); 

    };

    $(".video_thumb ul li").removeClass('active'); //Remove class of 'active' on all lists
    $(this).addClass('active');  //add class of 'active' on this list only
    return false;

}) .hover(function(){
    $(this).addClass('hover');
    }, function() {
    $(this).removeClass('hover');
});

这是页面的html：

<div class="main_image">
  <div id="vid">
    <video width="600" controls title="Video Title" style="z-index:1000;">
                <source id="video1" src="videos/video.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
                <source id="video2" src="videos/video.ogv" type='video/ogg; codecs="theora, vorbis"'>
            </video>
  </div>
</div>

任何帮助都会非常受欢迎。

4

1 回答 1

0

您应该使用 $(".video_thumb ul li").each(function(){$(this).click(function(){ .... 代替 $(".video_thumb ul li").click(function (){

于 2013-01-17T15:27:47.380 回答