Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

185
Vistas
¿Cómo invoco onYouTubeIframeAPIReady en una función diferente?

Tengo varias paginas web y en cada pagina solo cambio estas tres variables: IDYT, youtubeVideo, YTtime nada mas. Eventualmente, quiero escribir un archivo JS mediante el cual pueda importar una función que tome como entrada estas tres variables solo nada más.

En la página web actual, mis variables se definen de la siguiente manera:

 let IDYT = ["player", "player1", "player2", "player3"]; let youtubeVideo = ["E-xMXv3L5L8", "qNifU_aQRio", "yXEcd0eGrpw", "y17RuWkWdn8"]; let YTtime = [456, 119, 7, 17];

El resto del script es el siguiente y nunca cambiará en ninguna otra página web (¡Quiero escribir esto como una función que toma la entrada anterior!)

 // 2. This code loads the IFrame Player API code asynchronously. var tag = document.createElement("script"); tag.src = "https://www.youtube.com/iframe_api"; var firstScriptTag = document.getElementsByTagName("script")[0]; firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); // 3. This function creates an <iframe> (and YouTube player) // after the API code downloads. function Objects1(videoId1, startID1) { let object1 = { height: "315", width: "560", videoId: videoId1, playerVars: { autoplay: 0, loop: 1, start: startID1, // mute: 1, }, events: { onStateChange: onPlayerStateChange, }, }; return object1; } const players = []; function onYouTubeIframeAPIReady() { for (let index = 0; index < IDYT.length; index++) { element = IDYT[index]; object1 = Objects1(youtubeVideo[index], YTtime[index]); players.push(new YT.Player(element, object1)); } } // 5. The API calls this function when the player's state changes. // Here I set the "setPlaybackRate" value to "2". function onPlayerStateChange() { players.forEach((player) => player.setPlaybackRate(1.5)); }

Me resulta muy difícil escribir esto en una función que pueda exportar para poder usarla en otras páginas web. ¿Puedes ayudarme a resolver esto?

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Entonces, lo que hice fue copiar la fuente en un nuevo archivo JS. es decir, utilicé esta etiqueta fuente tag.src = "https://www.youtube.com/iframe_api";

Luego, debajo de este código, pegué el siguiente código

 // 3. This function creates an <iframe> (and YouTube player) // after the API code downloads. function Objects1(videoId1, startID1) { let object1 = { height: "315", width: "560", videoId: videoId1, playerVars: { autoplay: 0, loop: 1, start: startID1, // mute: 1, }, events: { onStateChange: onPlayerStateChange, }, }; return object1; } const players = []; function onYouTubeIframeAPIReady() { for (let index = 0; index < IDYT.length; index++) { element = IDYT[index]; object1 = Objects1(youtubeVideo[index], YTtime[index]); players.push(new YT.Player(element, object1)); } } // 5. The API calls this function when the player's state changes. // Here I set the "setPlaybackRate" value to "2". function onPlayerStateChange() { players.forEach((player) => player.setPlaybackRate(1.5)); }

Lo almacené en YouTubeSetting.js y luego en mi archivo HTML

Escribí lo siguiente:

 <script> let IDYT = ["player", "player1", "player2"]; let youtubeVideo = ["qz0aGYrrlhU", "1Rs2ND1ryYc", "TJF4ldO91n4"]; let YTtime = [1855, 870, 852]; // 2. This code loads the IFrame Player API code asynchronously. var tag = document.createElement("script"); // tag.src = "https://www.youtube.com/iframe_api"; tag.src = "../JS/YouTubeSetting.js"; var firstScriptTag = document.getElementsByTagName("script")[0]; firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); </script>

Esto resolvió mi problema, pero espero que alguien pueda darme una mejor opción en el futuro.

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda