2 votes

Insertion d'un DOM script.

J'ai eu l'intention d'insérer un petit script dans le DOM au moment de l'exécution afin de charger un lecteur vidéo. Mais le lecteur est chargé à tous les endroits différents, sauf à l'adresse suivante <div> Je ne comprends pas comment faire avec ce problème. J'ai collé le code entier ici. Aidez-moi s'il vous plaît.

<html>
<head><title>video test</title>
<script type="text/javascript" src="resources/js/jquery.js"></script>
<script type="text/javascript" src="swf.js"></script>
<script type="text/javascript">

$(document).ready(function(){
//  debugger;
    var template = $('<div class="sResult"><div class="figure"></div><div class="title"></div></div>');
    var url = 'http://player.ooyala.com/player.js?width=320&amp;height=240&amp;embedCode=thbXMxMzpq0RhOS82Hzx1lma8UMnFN-3&amp;callback=apicallback';
    var tempScript = document.createElement('script');
    tempScript.type = 'text/javascript';
    tempScript.src = url;

    $("#main").append(template);

    $("div.figure", $('#main')).html(tempScript);
    $("div.title", $('#main')).append("testkjdfnkjdb");

})
</script>   

</head>
<body>
    <div id="main"></div>
</body>
</html>

la procédure d'appendice pour div.title fonctionne bien, mais la div dans lequel j'essaie d'annexer le lecteur vidéo ne fonctionne pas correctement. Le lecteur vidéo est annexé à l'objet <head>

EDIT: Est-ce qu'un gourou du javascript peut regarder dans le player.js et me dire pourquoi ça ne marche pas pour moi ?

le joueur <div> contient les éléments suivants :

<div style="width: 320px; height: 240px; overflow: hidden;" id="ooyalaPlayer6764909_10qreejOoyalaPlayerOutterWrapper"><object width="320" height="240" type="application/x-shockwave-flash" id="ooyalaPlayer6764909_10qreej" class="OoyalaVideoPlayer" data="http://player.ooyala.com/static/cacheable/fb1a00342b9ec2d6df7c69946617dcee/player_v2.swf"><param name="allowScriptAccess" value="always"><param name="allowFullScreen" value="true"><param name="bgcolor" value="#000000"><param name="wmode" value="window">
<param name="flashvars"></object></div>

2voto

chrisl Points 246

Vous pouvez également fournir au lecteur Ooyala un paramètre de chaîne de requête targetReplaceId=(élément id) pour le forcer à remplacer un élément sur la page.

1voto

Gabriel Gartz Points 1715

Fixez d'abord votre URL, en passant le playerId param.

    var url = 'http://player.ooyala.com/player.js?playerId=player&width=320&amp;height=240&amp;embedCode=thbXMxMzpq0RhOS82Hzx1lma8UMnFN-3&amp;callback=apicallback';

Créer un écouteur pour le chargeur tempScript et ajouter le lecteur script à l'en-tête :

$(tempScript).load(function() {
     $('#main').find('div.figure').append($('head>div'));
});
$('head')[0].appendChild(tempScript);

Dans l'écouteur, déplacez le contenu du lecteur où vous le souhaitez et réappliquez-le.

Je suppose que le problème se trouve dans le player.js, et non pas là où vous attachez le chargeur script.

Ooyala API Docs : http://ooyala.com/support/docs/player_api#javascript

-1voto

buddhabrot Points 1518

Votre sélecteur est faux :

$("#main div.figure").html(tempScript);

etc.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X