Замена внутри javascript-кода с помощью innerhtml?

Question

Такая простая вещь, которую мне нужно сделать, и похоже, что ни один из обычных игроков swf не удовлетворит мои потребности, поэтому я думаю, что мне нужно сделать это обходным путем. Мне просто нужно иметь возможность переключаться между высоким качеством и низким качеством .flv видео.

Так что я думаю о том, что у меня есть две кнопки с событиями onclick, чтобы изменить innerhtml javascript, но я понял, что не знаю точно, как это сделать. могу ли я создать идентификатор одной строки javascript, или я должен заменить все это? Вот мой код:

<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"> 

В приведенном выше коде, все, что мне нужно изменить это «/lessons/videos/BukaTiende.flv» ссылка на что-то вроде /lessons/videos/BukaTiende_lower.flv

Могу ли я сделать это с помощью getElementById?

У меня есть jquery.

Answer 1

Я предлагаю герметизирующий эти команды в функции, и запустить его с одним или другим видео в качестве параметра на клике.

Вы сказали, что у вас есть jQuery, поэтому также можете использовать его для привязки к кнопкам.

<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

Вы можете удалить внедренный объект со страницы, когда пользователь нажимает кнопку, а затем перезапустить скрипт, который добавляет его на страницу, но с другим значением переменной. Если вы поместите SWFObject внутри div, вы можете очистить div, установив innerHTML = "";

Answer 3

Вы должны сделать функцию, которая принимает в качестве параметра URL на видео, а затем вызывает SWFObject с этим paremeter .. (уведомление на addVariable мы используем параметр функции)

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'); 
} 

затем добавить называют его первый раз с

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

так же добавить идентификатор к кнопкам, так что вы можете ссылаться на них

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

, а затем добавить событие нажатия на кнопки ..

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