innerHTML из <iframe> по событию onchange тега <select>
Добрый день! Мой код:
<select id="s1" name="s1">
<option>1111</option>
<option>2222</option>
<option>3333</option>
<option>4444</option>
<option>5555</option>
<option>6666</option>
</select>
<iframe id="myframe" name="myframe"></iframe>
<p name='pr' id='pr'>1234</p>
<script>
function prov(){
var stroka='/text' + s1.selectedIndex + '.html';
document.getElementById("myframe").src = stroka;
var frm=document.getElementById("myframe").contentDocument.body.innerHTML;
pr.innerHTML=frm;
}
s1.onchange = prov;
</script>
Смысл: по событию onchange в зависимости от выбранной опции должен текст html документа должен отобразиться в абзаце. Обрабатывается с запаздыванием, т.е. в переменную stroka присваивается текст, который содержится в iframe до запуска функции, а не который присваивается в процессе выполнения функции. При этом если написать так:
<select id="s1" name="s1">
<option>1111</option>
<option>2222</option>
<option>3333</option>
<option>4444</option>
<option>5555</option>
<option>6666</option>
</select>
<iframe id="myframe" name="myframe"></iframe>
<p name='pr' id='pr'>1234</p>
<script>
function prov(){
var stroka='/text' + s1.selectedIndex + '.html';
document.getElementById("myframe").src = stroka;
alert("chto ugodno");
var frm=document.getElementById("myframe").contentDocument.body.innerHTML;
pr.innerHTML=frm;
}
s1.onchange = prov;
</script>
То работает как надо. Подскажите в чем дело. Я только начинаю познавать JS PS Извиняюсь за такое название темы. Не нашел как его изменить после создания |
Понять не могу, почему наличие alert влияет на результат
|
для начала, то если судить по твоему коду s1 у нас берется из воздуха. Где определена эта переменная?
Вобщем ясно как белый день что выше по коду ты определяешь в переменную s1 свой селект, а s1.selectedIndex - значение выбранного оптиона. И закономерно получаешь каждый раз одно и то же значение. Его надо вычислять во время выполнения функции prov() |
Спасибо за ваше мнение. Вроде как разобрался. По-моему проблема была в том, что файл html не успевал подгрузиться в iframe. Чуть переписал код с использованием setTimeout и заработало.
|
Когда это возможно, лучше использовать колбэк на onload, чем костыль с setTimeout.
|
Цитата:
|
Arcon,
<iframe id="myframe" name="myframe" onload="myFunction()"></iframe> |
Премного благодарен! Здорово работает. Я не думал что при изменении src для iframe происходит событие load
|
Цитата:
Код теперь выглядит так:
<p><select id="s1" name="s1">
<option>1111</option>
<option>2222</option>
<option>3333</option>
<option>4444</option>
<option>5555</option>
<option>6666</option>
</select>
<iframe id="myframe" name="myframe" onload="prov()" >Ваш браузер не поддерживает iframe</iframe></p>
<p id="pr" name="pr">1234</p>
<script>
function zapis(){
var frm=document.getElementById("myframe").contentDocument;
pr.innerHTML=frm.body.innerHTML;
}
function prov(){
var s1=document.getElementById("s1")
var stroka='/text' + s1.selectedIndex+ '.html';
document.getElementById("myframe").src = stroka;
zapis()
}
</script>
Если не сложно поясните, пожалуйста, как работает onload в данном случае. Везде пишут, что событие срабатывает, когда полностью загружается страница |
Цитата:
|
| Часовой пояс GMT +3, время: 00:08. |