Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 08.07.2014, 19:04
Новичок на форуме
Отправить личное сообщение для Arcon Посмотреть профиль Найти все сообщения от Arcon
 
Регистрация: 08.07.2014
Сообщений: 7

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 Извиняюсь за такое название темы. Не нашел как его изменить после создания

Последний раз редактировалось Arcon, 08.07.2014 в 19:06. Причина: Накосячил с названием темы
Ответить с цитированием
  #2 (permalink)  
Старый 08.07.2014, 21:30
Новичок на форуме
Отправить личное сообщение для Arcon Посмотреть профиль Найти все сообщения от Arcon
 
Регистрация: 08.07.2014
Сообщений: 7

Понять не могу, почему наличие alert влияет на результат
Ответить с цитированием
  #3 (permalink)  
Старый 09.07.2014, 08:34
Профессор
Отправить личное сообщение для krasovsky Посмотреть профиль Найти все сообщения от krasovsky
 
Регистрация: 21.12.2012
Сообщений: 869

для начала, то если судить по твоему коду s1 у нас берется из воздуха. Где определена эта переменная?
Вобщем ясно как белый день что выше по коду ты определяешь в переменную s1 свой селект, а s1.selectedIndex - значение выбранного оптиона. И закономерно получаешь каждый раз одно и то же значение.
Его надо вычислять во время выполнения функции prov()
Ответить с цитированием
  #4 (permalink)  
Старый 09.07.2014, 11:11
Новичок на форуме
Отправить личное сообщение для Arcon Посмотреть профиль Найти все сообщения от Arcon
 
Регистрация: 08.07.2014
Сообщений: 7

Спасибо за ваше мнение. Вроде как разобрался. По-моему проблема была в том, что файл html не успевал подгрузиться в iframe. Чуть переписал код с использованием setTimeout и заработало.
Ответить с цитированием
  #5 (permalink)  
Старый 09.07.2014, 11:15
Аватар для BETEPAH
Профессор
Отправить личное сообщение для BETEPAH Посмотреть профиль Найти все сообщения от BETEPAH
 
Регистрация: 23.06.2011
Сообщений: 1,165

Когда это возможно, лучше использовать колбэк на onload, чем костыль с setTimeout.
Ответить с цитированием
  #6 (permalink)  
Старый 09.07.2014, 12:20
Новичок на форуме
Отправить личное сообщение для Arcon Посмотреть профиль Найти все сообщения от Arcon
 
Регистрация: 08.07.2014
Сообщений: 7

Сообщение от BETEPAH Посмотреть сообщение
Когда это возможно, лучше использовать колбэк на onload, чем костыль с setTimeout.
Не могли бы по подробнее о чем речь???
Ответить с цитированием
  #7 (permalink)  
Старый 09.07.2014, 12:29
Аватар для BETEPAH
Профессор
Отправить личное сообщение для BETEPAH Посмотреть профиль Найти все сообщения от BETEPAH
 
Регистрация: 23.06.2011
Сообщений: 1,165

Arcon,
<iframe id="myframe" name="myframe" onload="myFunction()"></iframe>
Ответить с цитированием
  #8 (permalink)  
Старый 09.07.2014, 12:37
Новичок на форуме
Отправить личное сообщение для Arcon Посмотреть профиль Найти все сообщения от Arcon
 
Регистрация: 08.07.2014
Сообщений: 7

Премного благодарен! Здорово работает. Я не думал что при изменении src для iframe происходит событие load
Ответить с цитированием
  #9 (permalink)  
Старый 09.07.2014, 21:03
Новичок на форуме
Отправить личное сообщение для Arcon Посмотреть профиль Найти все сообщения от Arcon
 
Регистрация: 08.07.2014
Сообщений: 7

Сообщение от BETEPAH Посмотреть сообщение
Arcon,
<iframe id="myframe" name="myframe" onload="myFunction()"></iframe>
Все-таки возникла проблема: Теперь содержимое обазаца, в который я вставляю текст из iframe отображается правильно, но при этом оно постоянно обновляется (даже визуально заметно мерцает немного и ссылки, которые в нем есть, на нажатия не реагируют) , видно как постоянно крутится индикатор загрузки страницы.
Код теперь выглядит так:
<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 в данном случае. Везде пишут, что событие срабатывает, когда полностью загружается страница
Ответить с цитированием
  #10 (permalink)  
Старый 09.07.2014, 22:50
Аватар для BETEPAH
Профессор
Отправить личное сообщение для BETEPAH Посмотреть профиль Найти все сообщения от BETEPAH
 
Регистрация: 23.06.2011
Сообщений: 1,165

Сообщение от Arcon
Если не сложно поясните, пожалуйста, как работает onload в данном случае. Везде пишут, что событие срабатывает, когда полностью загружается страница
Так и есть. Но Вы же вызываете после загрузки функцию prov, а она в 20й строке задает ифрейму src и происходит перезагрузка фрейма. И так по кругу
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Реализация функции JavaScript, меняющей содержимое ячеек таблицы по событию onchange BOJIKOJIAK Events/DOM/Window 1 24.05.2010 05:50