#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.