jquery не работает после вызова ajax (ответ во всплывающем окне)

У меня есть страница jsp с формой и кодом jquery. Код Jquery работает отлично, но если я возвращаю эту страницу во всплывающем окне с помощью вызова ajax, код jquery больше не работает.

Я также пытался использовать делегирование, то есть:

  $('select[name=myElementName]').on("change", function() {
        // some code
});

  or

  $(document).on("change", 'select[name=myElementName]', function() {
        // some code
});

вместо

 $('select[name=myElementName]').change(function() {    
             // some code
    });

Звонок Аякса:

  var preview = function () {           
    $.ajax({
       type: "POST",
       url: myAction.do,
       data: "id=" + myid,
   success: function (response) {  
    // some code
    var x=window.open('', '_blank', 'titlebar=no,scrollbars=yes,menubar=no,height='+height+',width='+width+',resizable=yes,toolbar=no,location=no,location=0,status=no,left='+left+',top='+top+'');
    x.document.open();
    x.focus();
    x.document.write(response);

    return false;
    },
    error: function () {  
        return false;
    },
  });           
 }; 

ИЗМЕНИТЬ

В Firefox 26.0 и Chrome 32.0.x я решил, используя

 x.document.close();

после

x.document.write(replace);

Вместо этого в IE игнорируются все включенные сценарии .js (например, jquery-ui-1.9.1.js).

ИЗМЕНИТЬ 2

я решил с

  <body onload="myload()">

и в моем jsp у меня есть определение myload(), в котором я вызываю сценарии.


person Sefran2    schedule 15.01.2014    source источник
comment
возможный дубликат функция Jquery не работает после вызова Ajax   -  person undefined    schedule 15.01.2014
comment
-Infinity без комментариев.   -  person undefined    schedule 15.01.2014
comment
Я не могу сказать, пытаетесь ли вы запустить прослушиватель событий .on('change'... на открытой странице или на странице, на которой вы сделали запрос. Пожалуйста, уточните.   -  person Brian Noah    schedule 19.01.2014
comment
@Brian Noah на новой открытой странице   -  person Sefran2    schedule 20.01.2014


Ответы (5)


Это потому, что вы создаете новую структуру DOM, но к ней не подключены обработчики событий. Самый простой способ — запустить обработчик событий в обратном вызове ajax:

$.ajax({

    ...
    success: function (response) {  
        // some code
        var x=window.open('', '_blank', 'titlebar=no,scrollbars=yes,menubar=no,height='+height+',width='+width+',resizable=yes,toolbar=no,location=no,location=0,status=no,left='+left+',top='+top+'');
        x.document.open();
        x.focus();
        x.document.write(response);

        // now, place the event handler here
        $('select[name=myElementName]', x.document.body).change(function() {    
                     // some code
        });
    }

}); 
person Tomas    schedule 17.01.2014
comment
а для внешнего .js? - person Sefran2; 18.01.2014
comment
@cricket, что ты имеешь в виду под внешним .js? Возможно, вам нужно более подробно проиллюстрировать свой пример в вопросе? - person Tomas; 18.01.2014
comment
@cricket, если вам нужно вызвать некоторые внешние функции js для установки обработчиков, сделайте это в обратном вызове ajax success. - person Tomas; 18.01.2014
comment
в этом случае ответ представляет собой целую HTML-страницу. На этой странице я включаю .js для выбора даты. Firefox и Chrome распознают его, но не ie. Например, мне пришлось поместить другие сценарии в функцию, вызываемую при загрузке страницы, но я не знаю, что делать с включенными. - person Sefran2; 19.01.2014
comment
@Cricket 1) затем снова вызовите эти сценарии из обратного вызова success. Это то, что вы должны сделать. 2) То, что я написал в ответе, помогает продемонстрированному вами коду. Кажется, вы сейчас говорите о чем-то другом. Если вы четко не продемонстрируете, что вы делаете и в чем заключается ваша проблема, никто не сможет помочь вам с вашей реальной проблемой, и ваша награда будет потрачена впустую. - person Tomas; 19.01.2014

Не используйте document.write, это полностью перезаписывает все, что было на странице во время записи, и приводит к условиям гонки (например, внешние скрипты могут быть уже загружены, но также могут и не загружаться, что приводит к неизвестному порядку загрузки write и скриптов ). Кроме того, я считаю, что documnt.write помещает в документ сериализованный текст, а не объекты DOM, поэтому он может не запускать события.

Вместо этого вы можете открыть новое окно и затем напрямую манипулировать объектами DOM (при условии, что он находится на том же сервере, что и ваша главная страница):

//Open a new window for the success info
var newWindow = window.open(newUrl);

//Now grab some element
var someItem = newWindow.document.getElementById( "someId");

//Manipulate dom either by "someItem.innerHTML" or "someItem.appendChild(...)"
person Don Rhummy    schedule 20.01.2014
comment
Я не понимаю, как использовать document.onload для всего ответа html-страницы вместо document.write, а затем добавить его в DOM. у вас есть пример или ссылка об этом? - person Sefran2; 21.01.2014
comment
Самый простой способ @Cricket - поместить код на страницу, которую вы загружаете, во фрейме (это должно находиться на том же сервере, что и внешняя страница), который сообщает внешней странице, что она загружена. iframe сделает это, вызвав функцию javascript в родительском элементе: parent.iframeLoaded();. В iframeLoaded вы должны добавить элементы или изменить существующие элементы iframe с помощью обычного javascript или jQuery, например: $("#myiframe").contents().append( "<p>Test</p>" );. - person Don Rhummy; 21.01.2014
comment
Я не использую (и не буду) использовать iframe. У меня есть ajax-вызов java-действия, которое возвращает html-страницу (в основном это форма предварительного просмотра с некоторым кодом запроса и включением некоторых внешних .js). Все работает, но в IE внешние .js игнорируются. - person Sefran2; 21.01.2014
comment
@Cricket Так проще! (Извините за iFrame, я неправильно понял, что вы делали). Опять же, держитесь подальше от document.write и вместо этого делайте то, что я показал выше (я отредактировал свой ответ) - person Don Rhummy; 21.01.2014

Если вы вызываете подпрограмму сервера AJAX и помещаете весь ответ без обработки на клиенте в новое окно, почему бы не открыть окно напрямую с URL-адресом этой подпрограммы AJAX и пропустить все:

....
var x=window.open(myAction.do + "?id=" + myid, 
 '_blank', 
 'titlebar=no,scrollbars=yes,menubar=no,height='+height+',width='+width+',resizable=yes,toolbar=no,location=no,location=0,status=no,left='+left+',top='+top+'');
....

Единственная разница здесь в том, что запрос представляет собой GET, а не POST-запрос, но данные представляют собой всего один идентификатор, что, вероятно, приемлемо?

person Axel Amthor    schedule 24.01.2014
comment
Я вызываю ajax из плагина jquery, который получает URL-адрес из jsp. Я не могу открыть окно напрямую - person Sefran2; 24.01.2014
comment
если вы можете передать URL-адрес вызову AJAX, вы также можете передать его любой другой функции javascript. - person Axel Amthor; 25.01.2014

У меня была аналогичная проблема в одном из моих проектов. Я решил это, написав метод успеха после вызова ajax.

            {
             $.ajax({
              type: "POST",
              url: "/abc/",
              data:{<data>},
              async:false,
              dataType:'json',
              success: function(response)                   
              {
                success=1;
                Id=response;
                  return;
              }
        });
        if (success)
        {
                #your code here
                var a='/xyz/?Id='+Id
                window.open(a,'_blank');
                window.location.href='/registration/'
        }
        return false;}
person Abhimanyu Bhosale    schedule 21.01.2014

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

person Makrand    schedule 21.01.2014