0

使用 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 和 Ipad 上进行测试，是的，PC 工作正常。但不幸的是，在 iPad 上，你得到的只是一个黑盒子，播放器上的下拉效果仍然有效，我觉得这很奇怪。

需要找出为什么它不能在 Ipad 上运行，它在 PC 上似乎很好，似乎是 HTML5，这是想要的，但在 ipad 上没有。

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

旁注：我尝试完全编辑代码并将我的简单调用和包装添加到 iframe，它可以工作但失去所有其他功能。

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

另外，我看到了一些有关导致问题的自动播放选项的信息，我现在需要将 autoplay=0 添加到 url，但我不确定他是如何构建它的以及在哪里插入它。

4

1 回答 1

1

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

由于 SWF/Flash 被 Apple/iOS 阻止，所有这些关于 SWF 和 Flash 的东西在设计上都不能在 ipad 或 iphone 上运行。

于 2013-09-19T16:16:19.077 回答