Question

使用JavaScript，YouTube播放器api，C＃asp.net 4.0，MS visual studio 2012。

我有以下JavaScript墙：

<script type="text/javascript" src="/Scripts/swfobject.js"></script>    
<script type="text/javascript">

// Load the IFrame Player API code asynchronously.

if (!PreIe8()) {

    var tag = document.createElement('script');
    tag.src = "https://www.youtube.com/player_api";
    var firstScriptTag = document.getElementsByTagName('script')[0];
    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
}

// Replace the 'ytplayer' element with an <iframe> and
// YouTube player after the API code downloads.
var player;
var vidIndex;
var videoIdList;
var VideoName;
var pre8;


$(document).ready(function() {

    PlayVideoFromDropDown();
    videoIdList = GetVideoData();
    vidIndex = <%= VideoId %>;
    VideoName = '<% = VideoName %>';
    $("#taketest").hide();
    pre8 =  PreIe8();

    // The video to load.
    var videoID = videoIdList[vidIndex].youtubeId;





    console.log(videoID);
    $("#video_title").text(videoIdList[vidIndex].Name);



    if (true) {
        VideoSwitch(videoID);
        flagMovieWatched2(videoIdList[vidIndex].NewVideoId, vidIndex, videoIdList.length);
    }
});


function VideoSwitch(video) {



    // Lets Flash from another domain call JavaScript
    var params = { allowScriptAccess: "always" };
    // The element id of the Flash embed
    var atts = { id: "ytPlayer" };
    // All of the magic handled by SWFObject (http://code.google.com/p/swfobject/)
    swfobject.embedSWF("http://www.youtube.com/embed/" + video + "?rel=0&autoplay=1&version=3&enablejsapi=1&playerapiid=ytPlayer",
        "ytPlayer", "520", "390", "9", null, null, params, atts);



}


function PlayVideoFromDropDown() {
    $("#videoSelection").on("change", function() {
        vidIndex = $(this).find(':selected').index();

        if (vidIndex > 0) {
            vidIndex = vidIndex - 1;
            $("#video_title").text(videoIdList[vidIndex].Name);

            if (true) {

                VideoSwitch(videoIdList[vidIndex].youtubeId);
                flagMovieWatched2(videoIdList[vidIndex].NewVideoId, vidIndex, videoIdList.length);

            } else {

                player.loadVideoById($(this).val());
            }

        }

    });

}

function onYouTubePlayerAPIReady() {

    if (!pre8) {
        console.log("Initialising API");
        player = new YT.Player('ytplayer', {
            height: '390',
            width: '520',
            enablejsapi: 1,
            playerVars: {
                'rel': 0,
                'modestbranding': 1
            },
            events:
                {
                    'onReady': onPlayerReady,
                    'onStateChange': ytStateChange
                }
        });

    }
}


function onPlayerReady() {
    console.log("vidIndex: " + vidIndex);
    playNextVideo();
}

function playVideoById(videoId) {
    console.log("video id = " + videoId);
    player.loadVideoById(videoId, 0, "default");
}

function playNextVideo() {
    console.log("Hi vid length = " + videoIdList.length);
    if (vidIndex < videoIdList.length) {
        var videoToPlay = videoIdList[vidIndex].youtubeId;
        console.log("Loading: " + videoToPlay);
        $("#video_title").text(videoIdList[vidIndex].Name);
        player.loadVideoById(videoToPlay, 0, "default");

    }
}

function GetVideoData() {
    var videoData = new Array();
    var video;
        <% foreach(var data in PlayListData) { %>
        video = new Object();
        video.id = '<%= data.VideoId %>';
        video.NewVideoId = '<%= data.NewVideoId %>';
        video.youtubeId = '<%= data.YoutubeVideoId %>';
        video.Name = '<%= data.Name %>';
        video.ModuleId = '<%= data.ModuleId %>';
        videoData.push(video);
        <% } %>
        return videoData;

    }


    function ytStateChange(state) {
        switch (state.data) {
            case YT.PlayerState.ENDED:
                console.log("Video Ended");


                console.log("video stats" + videoIdList[vidIndex].id + " " + vidIndex + " " + videoIdList.length - 1);
                flagMovieWatched2(videoIdList[vidIndex].NewVideoId, videoIdList.length - 1);
                vidIndex++;
                playNextVideo();
                break;
            case YT.PlayerState.PLAYING:
                console.log("Video Playing");
                break;
            case YT.PlayerState.PAUSED:
                console.log("Video Paused");
                break;
            case YT.PlayerState.BUFFERING:
                console.log("Video Buffering");
                break;
            case YT.PlayerState.CUED:
                console.log("Video Queued");
                break;
            default:
                console.log("Unstarted");
                break;
        }

    }


    function flagMovieWatched2(movieId, movieIndex, playlistIndex) {
        $.post("<%= SiteSettings.PublicVirtualPath %>ajax/videos/flagvideo2.aspx",
            {
                param_movie: movieId,
                movieIndex: movieIndex,
                playlistIndex: playlistIndex
            }, function(data) {

                if (data == "true") {
                    showButton();
                }
            });
    }


    function showButton() {
        $("#taketest").fadeIn();
    }

现在我们刚刚开始测试pc和Ipads，是的PC工作正常。但不幸的是，在iPad上，你得到的只是一个黑盒子，对播放器的下拉效果仍然有效，我觉得很奇怪。

需要找出为什么它不能在Ipad上工作，它在PC上显得很好，看起来是HTML5，这是什么想要的，但在ipad上没什么。

请注意，我的经验非常有限。任何帮助都会非常感谢！

SIDE注意：我已经尝试完全编辑代码并添加了我的简单调用并将其换行到iframe，iframe可以正常运行但是会失去所有其他功能。

我还尝试删除具有调用此代码的ID的DIV，并将其替换为Iframe换行。我认为这就是我得到下拉效果但没有视频的原因。

另外，我已经看到一些有关自动播放选项的信息来解决问题，我现在需要将autoplay = 0添加到网址，但我不确定他是如何构建它以及将其插入的位置。

Answer 1

我认为你的问题是“需要找出为什么它不能在Ipad上工作”，这是我对此的回答：

所有关于SWF和Flash的内容都不会在ipad或iphone上运行，因为Apple / iOS阻止了SWF / Flash。

youtube嵌入iframe黑匣子

1 个答案: