Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > JavaScript: Общие вопросы > скрипт не работает во всплывающем окне


Автор: Lely 31.7.2010, 14:16
Всем здравствуйте...

Никак не могу победить одну плохую вещь...яваскриптом генерирую всплывающее окно, его содержимое аяксом получаю от сервера...записываю содержимое для проверки в отдельный файл...

вот в этом проверочном файле яваскрипт работает...а во всплывающем окне нет  smile ...на самом деле там все немного сложнее...но я для того чтобы тут выложить упростила...

всплывающее окно
Код

<div id="edForm" style="width:195px; height:90px;">
<script language="javascript" src="my.js" type="text/javascript"></script>
        <input id="ex" type="text" onClick="my(); alert('Hey');" name="login" size="14"/>

        <input type="password" name="pass" size="14"/>

</div>


вызываемый яваскрипт
Код

function my() { 
alert('Hey');
}


помогите пожалуйста...всю голову уже сломала...

Автор: Amphiluke 31.7.2010, 15:27
Цитата(Lely @  31.7.2010,  18:16 Найти цитируемый пост)
но я для того чтобы тут выложить упростила...

Вот самое важное и потерялось.  smile  
Надо взглянуть на код, открывающий новое окно и пишущий содержимое в него. Относительный путь к скрипту "my.js" соответствует ли расположению документа, открываемого в новом окне?

Добавлено через 2 минуты и 12 секунд
Да. Еще хотелось бы поконкретнее про ошибку, а именно что пишется в консоль ошибок.

Автор: Lely 2.8.2010, 11:47
Цитата

Надо взглянуть на код, открывающий новое окно и пишущий содержимое в него. 

он очень огромный, дважды взывающий к аяксу (один раз за содержимым окна, второй раз за картинкой крестика закрытия этого окна)...поэтому вкратце основные моменты...
Код

function updatePage() 
{ 
    if (request.readyState == 4) 
    { 
        if (request.status == 200) 
        {
            var fBody = document.body;
            // Затененность
            var roSpan = document.createElement("SPAN");
            roSpan.id = 'popUpSpan';
            //задаю стиль затененности
..........................

            roSpan.style.cssText = roStyle;
            fBody.appendChild(roSpan);

            // контейнер = контент всплывающего окна
            var divPop = document.createElement("DIV");
            divPop.id = 'popUpDiv';

            // Контент всплывающео окна
            var ajaxHTML = request.responseText;
            divPop.innerHTML = ajaxHTML;

            fBody.appendChild(divPop);
            //определяю ширину и высоту исходя из размеров того, что в окне и задаю стиль всплывающего окна
..........................            
            //контейнер для закрывающего крестика
            divClose = document.createElement("DIV");
            divClose.id = 'Close';

            //определяю стиль крестика
..........................

            divClose.style.cssText = CloseStyle;
            divPop.appendChild(divClose);

            // Рисунок крестика, закрывающего всплывающее окно
            callserver();
            
        } 
        else alert("status is " + request.status); 
    } 
}


Цитата

Относительный путь к скрипту "my.js" соответствует ли расположению документа, открываемого в новом окне?

вроде да...все задаю просто от корня сайта...

Цитата

Еще хотелось бы поконкретнее про ошибку, а именно что пишется в консоль ошибок. 

тут самое интересное...у мозилы вообще ошибок нет...упрощенный мой код после запуска отладчика работает там замечательно...а вот мой самодельный визивиг, подгружаемый в это окно работает не очень, но все равно лучше, чем во всех остальных браузерах - кнопки работают (т.е. скрипт подключается и функционирует...айфрайм некликабельный и нерабочий вообще smile ...текстариа (включающаяся в режиме хтмл) работает нормально...)

в опере мой упрощенный скриптик выдает ошибку при клике
Цитата

Uncaught exception: ReferenceError: Undefined variable: myf
Error thrown at unknown location in <anonymous function>(event):

причем это он выдает у меня уже даже при вот таком варианте скрипта, прописанном прямо во всплывающем этом окне
Код

<div id="edForm" style="width:195px; height:90px;">
<script language="javascript" type="text/javascript">
alert('Hey');
function myf(str) 
{ 
alert(str);
}
</script>
        <input id="ex" type="text" onClick="myf('ups'); alert('Hey');" name="login" size="14"/>

        <input type="password" name="pass" size="14"/>

</div>

соответственно тут тоже мой самодельный визивиг отказывается работать...но тут у него не работают кнопки...выдавая ошибки при кликах полностью аналогичные приведенной выше...+ айфреим тоже полностью нерабочий...

ну а в ИЕ все также как в опере...только ошибкой выдает при клике- "Предполагается наличие объекта"

Автор: bazzjr 2.8.2010, 12:40
Проблемы в синтаксисе кода JS. Как вариант стоит  попробовать отдельно создать то самое окно(DIV) и в него добавлять все что нужно – eval(ajaxHTML);

Автор: Lely 2.8.2010, 13:08
bazzjr, а как понять отдельно?...отдельную функцию для этого сделать, исползующую eval?

Автор: bazzjr 2.8.2010, 13:37
            var divPop = document.createElement("DIV");
            divPop.id = 'popUpDiv';
Вместо createElement("DIV"), создать заранее этот div


            
            var ajaxHTML = request.responseText;
            divPop.innerHTML = ajaxHTML;
Вместо этой конструкции прописать
            var ajaxHTML = request.responseText;
            eval(ajaxHTML);

Автор: Lely 2.8.2010, 14:00
Цитата

создать заранее этот div

поняла...способ может и рабочий...но мне никак не подходит - создаваться всегда должны разные divы...причем создаваться именно с использованием аякса... smile ...

разве что только отдельно передавать аяксом нтмл...потом отдельно брать яваскрипт и его eval...как вы думаете это поможет?...ведь там в нтмле еще будут всякие onClick="

Автор: Lely 2.8.2010, 14:21
вот...я попробовала...так тоже не работает(((

Код

//предположим мы получили отдельно аяксом eval_it
            var eval_it = "alert('Hey');function myf(str){alert(str);}";
            divPop.innerHTML = eval(eval_it);
            // Контент всплывающео окна
            var ajaxHTML = request.responseText;
            divPop.innerHTML = ajaxHTML;


все тоже самое - не работает с той же ошибкой smile 

Автор: ksnk 2.8.2010, 14:51
поиск в гугле минуты за 2 вывел вот на такой http://www.softtime.ru/forum/read.php?id_forum=4&id_theme=70798. imho - доступно.
Чтоб не возится с такими проблемами - рекомендуется использовать фреймворки. 

Вот последний комментарий в http://api.jquery.com/load/. На всякий случай...

Автор: Lely 2.8.2010, 16:19
ksnk, ух ты...спасибо за ссылочку...сейчас попробую...

Добавлено через 10 минут и 30 секунд
пример с алертом заработал...а вот с неработающим во всплывающем окне айфреймом непонятки smile ...

Автор: Lely 2.8.2010, 22:52
Цитата

а вот с неработающим во всплывающем окне айфреймом непонятки

выдает такие ошибки:
ИЕ
Цитата

Сообщение: 'iframe' -  есть null или не является объектом

Опера
Цитата

Uncaught exception: TypeError: Cannot convert 'iframe' to object

Мозила
Цитата

Ошибка: iframe is null


iframe определяю в самом начале скрипта так
Код

var isGecko = navigator.userAgent.toLowerCase().indexOf("gecko") != -1;
var iframe = (isGecko) ? document.getElementById("edit") : frames["edit"];
var iWin = (isGecko) ? iframe.contentWindow : iframe.window;
iWin.document.designMode = "on";
iWin.document.execCommand("useCSS", false, true);


подскажите, в чем ошибка?

Автор: bazzjr 3.8.2010, 08:58
Lely, вы не правильно используете eval(), вместо " нужно ставить одинарные кавычки ' – 'alert('Hey');function myf(str){alert(str);}'
 
Я точно не уверен, но вы хотите исполнять функции, просто внедрив их посредством innerHTML.

Если я не ошибаюсь, таким образом код JS не будет исполнятся если его внедрить innerHTML, а  будет исполнятся лишь посредством eval().


Пример:
<div id="a1"></div>
<script>
var ev = 'alert("!!!");function myf(str){alert(str)};'; 
document.getElementById('a1').innerHTML = eval(ev);
myf('str');
//document.getElementById('a1').innerHTML = ev;
</script>
<input type="button" onclick="myf('str');" value="press"  />


В вашем случае вы создаете контейнер div с JS кодом(т.е. HTML и JS код  в одном флаконе), и потом все это внедряете innerHTML, так работать не будет.

Нужно "разделяй и властвуй"   smile 

Надеюсь понятно объяснил...

Автор: Lely 3.8.2010, 09:27
bazzjr, спасибо за ответы...но я с этим уже разобралась...в рессурсе, который привел 
ksnk написано что надо выбирать яваскрипт из ответа и создавать элемент <script> на странице...я так и написала
Цитата

пример с алертом заработал...

непонятно теперь только что делать с айфреймом...и почему он с одним и тем же кодом просто на страничке работает, а во всплывающем окне нет smile 

Автор: bazzjr 3.8.2010, 09:39
Возможно в iFrame не указан идентификатор?

А для чего iFrame? Что значит "на страничке работает, а во всплывающем окне нет"?

Автор: Amphiluke 3.8.2010, 10:54
Цитата(Lely @  3.8.2010,  02:52 Найти цитируемый пост)
iframe определяю в самом начале скрипта так

Этот код выполняется непосредственно на «верхнем» уровне, т.е. вне всяких функций? Или он выполняется по событию load объекта window? Или по какому-то иному событию? В любом случае, получается, что к моменту выполнения этого кода объект с id="edit" не существует. Если код, объявляющий переменную iframe, выполняется на «верхнем» уровне, то необходимо, чтобы объект <script>, содержащий этот код, располагался после объекта с id="edit" в дереве DOM. (Можно просто document.body.appendChild("этот_объект_script")). Ну и поскольку всё содержимое грузится в окно AJAX'ом, то, конечно, скрипт и по хронологии должен подгружаться после HTML-контента.

Вообще, конечно, можно поступить по-простому и всякий раз перед тем как в какой-то функции начинать работать с переменной iframe, проверять, а не null ли она. Если null, то инициализировать. Тогда этот код можно вынести в отдельную функцию
Цитата

Код

function initIframe() {
    isGecko = navigator.userAgent.toLowerCase().indexOf("gecko") != -1;
    iframe = (isGecko) ? document.getElementById("edit") : frames["edit"];
    iWin = (isGecko) ? iframe.contentWindow : iframe.window;
    iWin.document.designMode = "on";
    iWin.document.execCommand("useCSS", false, true);
}


и перед обращением к iframe делать проверку 
Код

try {
    if (!iframe) initIframe();
} catch(e) {
    alert("Объект с id='Edit' не существует\n"+e.message);
}


Добавлено через 4 минуты и 9 секунд
Цитата(Lely @  3.8.2010,  02:52 Найти цитируемый пост)
iframe определяю в самом начале скрипта так

Судя по ключевому слову var перед именем переменной iframe, это всё-таки делается в коде верхнего уровня, по всей видимости.

Автор: Lely 3.8.2010, 11:22
Цитата

Этот код выполняется непосредственно на «верхнем» уровне, т.е. вне всяких функций?

да да...именно так

Цитата

В любом случае, получается, что к моменту выполнения этого кода объект с id="edit" не существует. 

не знаю...если писать так
Код

<div id="edForm" style="width:195px; height:90px;">
<script language="javascript" type="text/javascript">
var iframe = document.getElementById('edit');
alert(iframe);
var iWin = iframe.contentWindow;

function myf(str) 
{ 
alert(str);
alert(document.getElementById('edit'));
}
</script>
    <iframe name="edit" id="edit" style="margin: 5px 5px 5px 5px; width: 95%; height: 223px; display: block; background-color: #FFFFFF;"></iframe>
    <textarea name="text" id="edithtml" style="margin: 5px 5px 5px 5px; width: 95%; height: 223px; display: none; background-color: #FFFFFF;">Контент</textarea>
    <input id="ex" type="text" onClick="myf('ups'); alert('Hey');" name="login" size="14"/>
    <input id="ex1" type="password" name="pass" size="14"/>
</div>

это код всего всплывающего окна из которого берется скрипт и вставляется после организации самого этого окна...и этот же код я для проверки пишу в отдельный файл...

опера на него и в случае всплывающего окна реагирует так:
по алерту первому алерту выводит null, а по второму выводит что там нашелся объект...а потом на строчку
Код

var iWin = iframe.contentWindow;

ругается "Uncaught exception: TypeError: Cannot convert 'iframe' to object"... smile 

делаю с функцией инициализации - выходи еще запутанней
Код

<div id="edForm" style="width:195px; height:90px;">
    <iframe name="edit" id="edit" style="margin: 5px 5px 5px 5px; width: 95%; height: 223px; display: block; background-color: #FFFFFF;"></iframe>
    <textarea name="text" id="edithtml" style="margin: 5px 5px 5px 5px; width: 95%; height: 223px; display: none; background-color: #FFFFFF;">Контент</textarea>
    <input id="ex" type="text" onClick="myf('ups'); alert('Hey');" name="login" size="14"/>
    <input id="ex1" type="password" name="pass" size="14"/>
<script language="javascript" type="text/javascript">
initIframe();
function initIframe() {
isGecko = navigator.userAgent.toLowerCase().indexOf("gecko") != -1;
iframe = document.getElementById("edit");
iWin = (isGecko) ? iframe.contentWindow : iframe.window;
iWin.document.designMode = "on";
iWin.document.execCommand("useCSS", false, true);
}

function myf(str) 
{ 
alert(str);
alert(document.getElementById("edit"));
initIframe();
try {
if (!iWin) initIframe();
} 
catch(e) {
alert("Объект с id='Edit' не существует\n"+e.message);
}
alert(iWin);
}
</script>
</div>

выводит длинную ошибку
Цитата

Uncaught exception: TypeError: Cannot convert 'iWin' to object
Error thrown at line 5, column 0 in initIframe() in http://www.test1.ru/virsicon/?page=about:
    iWin.document.designMode = "on";
called from line 13, column 0 in myf(str) in http://www.test1.ru/virsicon/?page=about:
    initIframe();
called from line 1, column 0 in <anonymous function>(event):
    myf('ups');

и главное...что alert(document.getElementById("edit")); срабатывает... smile ...а айфрейм так и остается некликабельный(((

Добавлено через 6 минут и 29 секунд
самое непонятное что браузер даже после того как
Код

var iframe = document.getElementById('edit');
alert(iframe);
var iWin = iframe.contentWindow;

выдает по алерту что объект iframe есть на следующую строчку ругается тем же
Цитата

Uncaught exception: TypeError: Cannot convert 'iframe' to object

 smile 

Автор: Lely 3.8.2010, 11:48
вот...с этим скриптом ошибок нет
Код

function initI() 
{ 
var iframe = document.getElementById('edit');
alert(iframe);
var iWin = iframe.contentWindow;
iWin.document.designMode = 'on';
iWin.focus();
}

function myf(str) 
{ 
initI();
alert(str);
alert(document.getElementById('edit'));
}

вот только айфрейм так и не ожил...тыкаться в него не получается smile 

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)