Меню
Что нового?

innerHTML + script + div

Krisha

pain in the neck
innerHTML + script + div

Задача: Менять содержимое слоя и подставлять нужный JS.

Простой пример кода:

Код: 
<html><body>

<script type="text/javascript">

var texts = {
      1:'<a href="javascript:draw_select()">test1</a>',
      2:'<a href="javascript:draw_select()">test2</a>'
}

var scripts = {
      1:'function draw_select() { alert("test1"); }',
      2:'function draw_select() { alert("test2"); }'
}
 
function f(id){
   document.getElementById('myscript').innerHTML = scripts[id];
   document.getElementById('mydiv').innerHTML = texts[id];
}

</script>

<a href="javascript:f(1)">[test1]</a><br />
<a href="javascript:f(2)">[test2]</a><br />
 
<script id="myscript" type="text/javascript"></script>

<div id="mydiv" style="border:red 1px solid;"></div>

</body>
</html>
Проблема:
Загружаем страницу, кликаем на линку тест1 в слое получаем тест1, кликаем и видим алерт тест1. Далее, кликаем на линку тест2 в слое получаем тест2, кликаем и видим алерт тест1 ? Паника! При этом дом инспектор показывает, что там function draw_select() { alert("test2"); }

Вопросы:
Где я туплю?
Как и можно ли это дело заставить работать вообще?
Как и можно ли это дело заставить работать в ИЕ?

Спасибо!
 
boombick

boombick

boombick.org
Насколько я понял, необходима динамическая генерация скрипта?
я нашел только вот такое решение, оттестил в
Internet Explorer 6.0.2900.2180.xpsp_sp2
Mozilla/5.0 (X11; U; Linux i686; ru; rv:1.8.0.7) Gecko/20060909 Firefox/1.5.0.7
Opera/9.02 (X11; Linux i686; U; en)
Везде работает прекрасно
PHP: 
<html><body>

<script type="text/javascript">

   var d=document;
   var texts = {
      1:'<a href="#" onClick="draw_select(); return false;">test1</a>',
      2:'<a href="#" onClick="draw_select(); return false;">test2</a>'
    }
    
function f(id){
   var script= document.createElement('script');
   script.type= "text/javascript";
   script.text= 'function draw_select() { alert("test'+id+'"); }';
   document.getElementsByTagName('body')[0].appendChild(script);
   
   document.getElementById('mydiv').innerHTML = texts[id];
}

</script>

<a href="#" onClick="f(1); return false;">[test1]</a><br />
<a href="#" onClick="f(2); return false;">[test2]</a><br />
 
<div id="mydiv" style="border:red 1px solid;"></div>

</body>
</html>
 
Войдите или зарегистрируйтесь для ответа.
Сверху