Почему я должен вызвать Flowplayer дважды? - PullRequest
0 голосов
/ 18 февраля 2012

Это совершенно странно .......

Вот мой код:

HTML

   <a class="video" href="http://pseudo01.hddn.com/vod/demo.flowplayervod/flowplayer-700.flv" style="display:block;width:520px;height:330px">Test</a> 

JAVASCRIPT

$(document).ready(function () {
flowplayer('a.video', {
        src: '/swf/flowplayer.commercial-3.2.7.swf',
        clip: {
            autoPlay: false,
            autoBuffering: true
        }
    });
})

Выше examaple не работает, плеер не создается в DOM. Но нижеприведенный пример (все, что я делаю, это дважды вызываю flowplayer) .....?!

HTML

   <a class="video" href="http://pseudo01.hddn.com/vod/demo.flowplayervod/flowplayer-700.flv" style="display:block;width:520px;height:330px">Test</a> 

JAVASCRIPT

   $(document).ready(function () {
   flowplayer('a.video', {
        src: '/swf/flowplayer.commercial-3.2.7.swf',
        clip: {
            autoPlay: false,
            autoBuffering: true
        }
    });

   flowplayer('a.video', {
        src: '/swf/flowplayer.commercial-3.2.7.swf',
        clip: {
            autoPlay: false,
            autoBuffering: true
        }
    });
})

Почему?

Ответы [ 2 ]

2 голосов
/ 18 февраля 2012

Попробуйте удалить описание теста вашей гиперссылки, и оно должно работать:

<a class="video" href="http://pseudo01.hddn.com/vod/demo.flowplayervod/flowplayer-700.flv" style="display:block;width:520px;height:330px">**Test**</a>

Попробуйте переместить скрипт внизу страницы.Это одна из лучших практик

Это мой образец, и он работает:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Set default value</title>
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
        <script type="text/javascript" src="http://static.flowplayer.org/js/flowplayer-3.2.6.min.js"></script>
    </head>
    <body>
        <a class="video" href="http://pseudo01.hddn.com/vod/demo.flowplayervod/flowplayer-700.flv" style="display:block;width:520px;height:330px"></a>   

        <script type="text/javascript">
            $(document).ready(function () {

            flowplayer('a.video', {
                src: 'http://releases.flowplayer.org/swf/flowplayer-3.2.7.swf',
                clip: {
                    autoPlay: false,
                    autoBuffering: true
                    }
                });
            })
        </script>
    </body>
</html>
1 голос
/ 13 июля 2012

Я столкнулся с этой проблемой недавно, когда у меня был значок воспроизведения внутри тега привязки. Я закончил тем, что очистил тег привязки HTML по щелчку, чтобы решить эту проблему. Пример кода ниже.

HTML:

<a id="videoPlayer" class="videoPlayer" href="[VIDEO_URL]" style="background-image: url(VIDEO_THUMB_URL);">
    <img src="/images/icon_video_play.png" width="40" height="40" alt="View video" />
</a>

CSS:

a.videoPlayer { 
    display: block;
    width: 480px;
    height: 270px; 
    text-align: center; 
    cursor: pointer;
}

a.videoPlayer img {
    margin-top: 115px;
    border: 0px;
}

Javascript:

$(document).ready(function () {
    $("a.videoPlayer").click(function (e) { 
        // Empty anchor tag to avoid having to click twice
        $(this).empty();

        flowplayer("videoPlayer", "/flash/video/flowplayer.swf");               

        e.preventDefault();
    });

});
...