javascript не работает после вызова ajax

#javascript #ajax #xmlhttprequest

#javascript #ajax #xmlhttprequest

Вопрос:

У меня есть страница. В заголовке этой страницы у меня есть весь мой javascript. В теле страницы у меня есть ссылка, которая вызывает http-запрос ajax (я использую long hand xhr, а не jquery), и этот запрос выводит php-форму на мою страницу.

В этой форме есть несколько выпадающих списков выбора, которые отформатированы / оформлены с использованием jquery. Проблема, с которой я сталкиваюсь, заключается в том, что когда я помещаю форму непосредственно на страницу, выбор форматируется нормально при загрузке страницы. Но когда я удаляю форму со страницы и загружаю ее с помощью ajax, создается впечатление, что javascript не загружается.

Итак, javascript загружается при загрузке страницы, но когда я загружаю php-форму на страницу через ajax, javascript не работает. выпадающий список выбора не отформатирован. Похоже, что javascript нужно перезагрузить или что-то в этом роде.

Я не использую jquery для выполнения вызова. Я просто использую long hand ajax.

 function getPage(str)
 {
 if (str=="")
   {
   document.getElementById("center").innerHTML="";
   return;
   } 
if (window.XMLHttpRequest)
   {// code for IE7 , Firefox, Chrome, Opera, Safari
   xmlhttp=new XMLHttpRequest();
   }
 else
   {// code for IE6, IE5
   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
   }
 xmlhttp.onreadystatechange=function()
   {
   if (xmlhttp.readyState==4 amp;amp; xmlhttp.status==200)
     {
     document.getElementById("center").innerHTML=xmlhttp.responseText;
     }
   }
 xmlhttp.open("GET","xhr_php/get_page.php?page=" str,true);
 xmlhttp.send();
 }
  

Ответ №1:

Запускается скрипт стилизации jquery, после чего все готово. Если вы хотите, чтобы он снова запускался после вашего вызова ajax, поместите его в функцию и вызовите функцию при успешном завершении.

 function dostuff() 
{
    $('selector').css('var', 'val');
}
  

В случае успеха, когда status == 200 и readyState == 4, запустите свои настройки js css после того, как вы вставили HTML-ответ.

 xmlhttp.onreadystatechange=function()
{
    if (xmlhttp.readyState==4 amp;amp; xmlhttp.status==200)
    {
        document.getElementById("center").innerHTML=xmlhttp.responseText;
        dostuff();
    }
}
  

Комментарии:

1. Можете ли вы опубликовать пример этого, используя мой код выше. Я уже несколько часов ищу пример «при успешном завершении» и не могу его найти. Все, что я продолжаю находить, это jquery, и я не собираюсь использовать функцию jquery afax, я использую long hand. Смотрите мой ajax выше. Спасибо.

2. О, это стандартная часть вашего вызова AJAX. Я добавлю это в ответ вместо комментария.

Ответ №2:

в исходном виде выбранные файлы отформатированы с использованием скрипта, который запускается при загрузке страницы? если да, то это ваша проблема. загрузка формы через ajax /after / page load означает, что сценарии загрузки не повлияют на выбор. вам необходимо запустить скрипты после загрузки формы.

Комментарии:

1. добавьте его в событие onSuccess вызова Ajax. большинство руководств по jQuery покажут вам, как это сделать

2. пожалуйста, посмотрите мой ajax ниже. Я не использую jquery.

3. извините, что не позволил мне ответить на мой собственный вопрос, поэтому, пожалуйста, смотрите мой пост выше, я добавил ajax. Пожалуйста, дайте мне знать, куда я поместил функциональность onSuccess.

4. в разделе, где вы разместили это: document.getElementById("center").innerHTML=xmlhttp.responseText;

5. как бы я написал там функцию onSuccess. Я запустил onsuccess для ajax и вообще ничего не могу найти. Спасибо.

Ответ №3:

Не видя вашего кода, я бы сказал, что вам нужно использовать .live () или .bind() для привязки поведения к вашим элементам. Если вы применяете такие вещи, как datepicker или что-то еще на странице формы php, чтобы сделать эту функциональность доступной, вам нужно переназначить элементы, которые вы ввели с помощью XHR, в функции обратного вызова вашего запроса XHR.