Можно ли сделать выбор имени запускаемого js скрипта из <select>
Привет, народ.
Столкнулся с такой проблемой: есть список: <select name="selector" id="selector"> <option selected value='11111'>Скрипт 1</option> <option value="22222">2</option> <option value="NNN">Скрипт N</option> </select> <script type="text/javascript" charset="windows-1251" src="http://site.org/js/ИМЯ СКРИПТА_1.js"></script> Может кто подскажет, как можно сделать, чтобы ИМЯ СКРИПТА выбиралось из select и нужный скрипт выполнялся по событию onchange() Спасибо. |
http://javascript.ru/tutorial/dom/modify
по событию onchange списка создаете элемент script и крепите к документу |
Спасибо.
Попробовал сделать по примеру, но не получилось. Не работает. А как правильно написать? function setupScript(selectednumber) { var newScript = document.createElement('script') newScript.innerHTML='<script type="text/javascript" charset="windows-1251" src="http://site.org/js/'.selectednumber.'.js"></script>' document.body.appendChild(newScript) } <select name="number" id="selector" onchange="setupScript(this.options[this.selectedIndex].value"> <option selected value='11111'>Скрипт 1</option> <option value="22222">2</option> <option value="NNN">Скрипт N</option> </select> |
http://javascript.ru/ajax/transport/script
вот ссылка с более конкретным кодом |
Вот что получается:
Скрипт select.js ================= function attachScript(id, src){ src=src+'.js' var element = dojo.doc.createElement("script") element.type = "text/javascript" element.src = src element.id = id document.getElementsByTagName("head")[0].appendChild(element) } шаблон ================ <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <script src="select.js"></script> </head> <body> <select name="sel" id="selector" onchange="attachScript('script1',this.options[this.selectedIndex].value)"> <option selected value='1'>Скрипт 1</option> <option value='2'>Скрипт 2</option> <option value='3'>Скрипт 3</option> </select> <table id="_out" width="400" height="280" style="background-color:#f2f2f2; border: #cccccc 1px solid; font-family:Tahoma; font-size:12px; color:#000000;" cellpadding="2" cellspacing="0"> <tr><td>Выбор скрипта:</td></tr><tr><td><table id="_in" width=100% height=100% style="background-color:#f2f2f2; font-family:Tahoma; font-size:12px; color:#000000;" cellpadding="0" cellspacing="0"> </table></td></tr><tr name=="script1"></tr> <script name="myscript" id="myscript" type="text/javascript" charset="windows-1251" src="0.js"></script> <tr><td align="right">Спасибо за выбор!</td></tr> </table> </body> </html> скрипт 0.js, выполняемый по умолчанию -------------------------------- (function() { with(navigator) { _ = '<img width="24" height="24" src="1.gif">'; document.write('<tr><td colspan=4><u>Привет!</u><td> <span> Скрипт 0</span></td></tr>'); } })(); скрипт 1.js, должен выполнятся на той же странице при выборе Скрипт 1 ------------------------- (function() { with(navigator) { _ = '<img width="24" height="24" src="1.gif">'; document.write('<tr><td colspan=4><u>Привет1!</u><td> <span> Скрипт 1</span></td></tr>'); } })(); скрипт 2.js, должен выполнятся на той же странице при выборе Скрипт 2 (function() { with(navigator) { _ = '<img width="24" height="24" src="1.gif">'; document.write('<tr><td colspan=4><u>Привет2!</u><td> <span> Скрипт 2</span></td></tr>'); } })(); ... Не хочет работать в таком виде. Если в скрипте select.js меняю последнюю строку на: document.getElementsById("myscript")[0].appendChild(element) тоже не работает. Может быть есть идеи какие-то еще? Спасибо. |
1)меняем на
var element = document.createElement("script") 2)в подключаемых таким образом скриптах нельзя использовать document.write после окончания загрузки страницы он работает не так, как вы ожидаете. используйте innerHTML и другие способы изменения страницы, описанные в первой моей ссылке в теме |
Спасибо за помощь.
Попробую так сделать. |
Часовой пояс GMT +3, время: 14:28. |