как запускать идентичные функции javascript

#javascript #algorithm #function #optimization #name-collision

#javascript #алгоритм #функция #оптимизация #имя-столкновение

Вопрос:

после обширных исследований я не смог найти ответ, который соответствовал бы моим (довольно) низким навыкам в javascript. было бы большим облегчением, если бы кто-нибудь из вас мог помочь.

я пытаюсь запустить этот скрипт дважды на одной и той же странице, но я думаю, что проблема в том, что функция onYouTubePlayerReady не может быть вызвана два раза без перезаписи последней. Кроме того, если я изменю его имя, фактические функции выполняться не будут.

вот код. Я бы хотел, чтобы он воспроизводил до 4 видеороликов YouTube без звука и автозапуска на одной странице. вы знаете, как это возможно?

спасибо за ваше время

 <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Prova 1</title>

<script src="http://www.google.com/jsapi" type="text/javascript"></script>
    <script type="text/javascript">
      google.load("swfobject", "2.1");
    </script> 

</head>

<body align="center">


<div id="ytapiplayer2"></div>

    <script type="text/javascript">
        function onYouTubePlayerReady2(playerId2) {
            ytplayer2 = document.getElementById("myytplayer2");
            ytplayer2.playVideo();
            ytplayer2.mute();
                }
        var videoID2 = "OFIhzSwDfwo"
        var params = { allowScriptAccess: "always" };
        var atts = { id: "myytplayer2" };
        swfobject.embedSWF("http://www.youtube.com/v/"   videoID2   "?enablejsapi=1amp;playerapiid=ytplayer
        amp;autoplay=1amp;version=3amp;showinfo=0amp;iv_load_policy=3amp;controls=0amp;modestbranding=1",
        "ytapiplayer2", "250", "inherit", "0", null, null, params, atts)
    </script>



<div id="ytapiplayer"></div>

    <script type="text/javascript">
        function onYouTubePlayerReady(playerId) {
            ytplayer = document.getElementById("myytplayer");
            ytplayer.playVideo();
            ytplayer.mute();
                }
        var videoID = "e5iqtQLm-BM"
        var params = { allowScriptAccess: "always" };
        var atts = { id: "myytplayer" };
        swfobject.embedSWF("http://www.youtube.com/v/"   videoID   "?enablejsapi=1amp;playerapiid=ytplayer
        amp;autoplay=1amp;version=3amp;showinfo=0amp;iv_load_policy=3amp;controls=0amp;modestbranding=1",
        "ytapiplayer", "250", "inherit", "0", null, null, params, atts)
    </script>


</body>
</html>
  

Комментарии:

1. Я вижу пару вещей, которые могут быть проблематичными, например ytplayer , является глобальным, а не локальным для функции. Кроме того, вы заставляете функцию принимать аргумент, но она его не использует. У вас есть два идентичных фрагмента кода. Вы хотите сказать, что использование обоих не работает? Или у вас возникли проблемы с использованием исходной onYouTubePlayerReady функции для обоих видео?

2. привет, Феликс, должен ли я сделать их локальными, чтобы решить эту проблему?

3. Я не знаю, как я уже сказал, похоже, есть пара проблем. Например. у вас нет элементов с идентификаторами myytplayer2 или myytplayer . onYouTubePlayerReady2 никогда не будет вызываться, поскольку API не знает об этой функции.

4. второй скрипт работает так, как должен, используя их одновременно

5. я вижу элементы встраивания, имеющие эти идентификаторы myytplayer, и если onYouTubePlayerReady2 не распознается, как я могу запустить его для двух элементов (встроенных видео)?

Ответ №1:

Используйте аргументы вместо глобальных переменных, чтобы избежать побочных эффектов:

  function onYouTubePlayerReady2(playerId2, ytplayer2, video2, params, atts)
  

Затем передайте жестко заданные значения вместо изменения состояния во время каждого вызова.