jquery не определен в частичном представлении, загруженном через ajax в IE - PullRequest
Новая
       24

jquery не определен в частичном представлении, загруженном через ajax в IE

7 голосов
/ 19 марта 2011

У меня есть веб-страница, состоящая из виджета JQuery UI Tabs. Виджет вкладок загружает вкладки через AJAX. На одной из вкладок (назовите ее DescriptionPage ) у меня есть форма, которая будет отправлена ​​через плагин ajaxForm. 

<div id="tabs">
    <ul>
        <li>
           <a href="DescriptionPage">Description Page</a>
        </li>
    </ul>
</div>

Это содержимое моей DescriptionPage . 

<form id="myForm">
  <!-- Form elements goes here -->
</form>

<script>
  $(function(){
    $('#myForm').ajaxForm(function (response) {
      $('#myForm').parent().empty().append(response);
    });
  });
</script>

После отправки формы возвращается та же самая DescriptionPage , как формы, так и сценария. Таким образом, содержимое формы заменяется ответом серверной стороны. Ответ также содержит сообщения проверки.

Проблема в том, что весь сценарий хорошо работает в Chrome и Firefox. Но в Internet Explorer 8 возникает странная проблема.

Когда вкладка загружается впервые, JavaScript успешно выполняется. Когда пользователь отправляет форму и отправляет ответ, IE не может выполнить мой javascript, говоря: «JQuery не определен».

Почему IE не может вызвать JQuery внутри контента, загруженного через ajax? Есть ли обходной путь?

P.S: Я думал отделить скрипт от html, но это вообще не вариант: (

P.S2: Мои файлы JavaScript и CSS стали беспорядочными из-за глупого IE.

Ответы [ 5 ]

1 голос
/ 18 июня 2012

Пожалуйста, обратитесь к: jQuery 1.6.1, IE9 и SCRIPT5009: '$' не определено

Идентификатор пользователя "Черный" предоставил мне правильное направление.

Я загружал, используя .AjaxForm в диалоге.после этого я заменяю эту форму другой AjaxForm.Затем у меня была ошибка с «$ is undefined» или «jQuery is undefined». Основная причина в том, что я применил «render: layout => false» для второго диалога.Вот почему вся библиотека js (включая jQuery) не была загружена должным образом.

Так что, в части Второго диалога, я должен добавить.

1 голос
/ 19 марта 2011

Мне кажется, это работает в Internet Explorer 6:

index.html: 

<html><head></head><body>

<div id="container"></div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script src="jquery.form.js"></script>
<script>
    jQuery('#container').load('DescriptionPage.html');
</script>

</body></html>

DescriptionPage.html: 

<form id="myForm">
    <input type="submit" />
</form>

<script>
    $(function() {
        $('#myForm').ajaxForm(function(response) {
            $('#myForm').parent().empty().append(response);
        });
    });
</script>
0 голосов
/ 18 сентября 2013

Если вы используете IE, убедитесь, что вы используете jQuery версии 1. jQuery версии 2 не поддерживается IE .... хотя все остальное на планете поддерживает версию 2 ....

http://jquery.com/download/

0 голосов
/ 29 марта 2011

Вы можете попробовать что-то вроде этого: 

<form id="myForm">
  <!-- Form elements goes here -->
</form>

<script>
  (function($){
    $('#myForm').ajaxForm(function (response) {
      $('#myForm').parent().empty().append(response);
    });
  })(jQuery);
</script>

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

0 голосов
/ 25 марта 2011

Попробуйте что-то вроде этого, чтобы увидеть, решит ли это проблему: 

<script>
  $(function(){
    $('#myForm').ajaxForm(function (response) {
      $('#myForm').empty().append($(response).children('form').html());
    });
  });
</script>

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

...