Sostituzione all'interno javascript codice con innerHTML?

Question

Una cosa semplice che devo fare, e non sembra come nessuno dei giocatori regolari SWF soddisfare le mie esigenze, quindi penso che ho bisogno di fare questa soluzione alternativa. Ho solo bisogno di essere in grado di passare da una elevata qualità video e una bassa qualità .flv.

Così sto pensando di avere solo due pulsanti con gli eventi onclick per cambiare l'innerHTML del javascript, ma ho capito che non so esattamente come. posso creare un ID di una riga di JavaScript, o dovrei sostituire il tutto? Ecco il mio codice:

<script type="text/javascript">
var so = new SWFObject('/lessons/videos/player.swf','mpl','610','480','9');
so.addParam('allowfullscreen','true');
so.addParam('allowscriptaccess','always');
so.addVariable('file','/lessons/videos/BukaTiende.flv');
so.write('mediaspace');
</script>

</div></div>
<input type="button" value="low"><input type="button" value="high">

Nel codice di cui sopra, tutto quello che ho bisogno di cambiare è il link "/lessons/videos/BukaTiende.flv" a qualcosa di simile /lessons/videos/BukaTiende_lower.flv

Posso fare questo con un getElementById?

Io ho jquery.

Answer 1

Suggerisco di incapsulare i comandi in una funzione, e in esecuzione con uno o l'altro video come un parametro al clic.

Hai detto di avere jQuery in giro, quindi potrebbe anche usarlo per legare clic ai pulsanti.

<script type="text/javascript">
  function launch_video(quality){

    video_qual=(quality=='high')? '' : '_lower';

    var so = new SWFObject('/lessons/videos/player.swf','mpl','610','480','9');
    so.addParam('allowfullscreen','true');
    so.addParam('allowscriptaccess','always');
    so.addVariable('file','/lessons/videos/BukaTiende'+video_qual+'.flv');
    so.write('mediaspace');
    }

  $(document).ready(function(){
    $('.vid_button').click(function(){launch_video($(this).val());});
    });

</script>

</div></div><!-- I guess I'll leave those random divs in there-->

  <input class='vid_button'  type="button" value="low">
  <input class='vid_button' type="button" value="high">

Answer 2

Si dovrebbe fare una funzione che prende come parametro l'url del video e poi chiama lo SWFObject con quella paremeter .. ( preavviso presso il addVariable si usa il parametro della funzione )

function loadVideo( pUrl )
{
var so = new SWFObject('/lessons/videos/player.swf','mpl','610','480','9');
so.addParam('allowfullscreen','true');
so.addParam('allowscriptaccess','always');
so.addVariable('file', pUrl);
so.write('mediaspace');
}

quindi aggiungere chiamare la prima volta con

<script type="text/javascript">
       loadVideo('/lessons/videos/BukaTiende.flv');
</script>

giardini.L aggiungere un po 'id per i pulsanti in modo da poterli fare riferimento

<input type="button" value="low" id="low">
<input type="button" value="high" id="high">

e quindi aggiungere gli eventi click ai pulsanti ..

<script type="text/javascript">
   $(document).ready(
     function(){
        $('#low').click( function(){ loadVideo('/path/to/lowversion.flv') } );
        $('#high').click( function(){ loadVideo('/path/to/highversion.flv') } );
     }
   );
</script>

Answer 3

Si potrebbe rimuovere l'oggetto incorporato dalla pagina quando l'utente fa clic su un pulsante, e quindi eseguire di nuovo lo script che aggiunge alla pagina, ma con un valore variabile diversa. Se si mette lo SWFObject all'interno di un div, allora si può cancellare il div impostando innerHTML = "";