У меня есть главная страница, назовите ее Main.php. На этой странице есть кнопка, которая при нажатии на нее устанавливает внутренний HTTML div (уже на Main.php, называемый divResults) с результатами Results.php.
Когда вызывается метод «Results.php», возвращаемый HTML «Эти результаты» правильно принимается и устанавливается как содержимое для divResults на Main.php. Однако любой javascript из Results.php не выполняется. Например, я пытаюсь сделать простой window.alert. Вот пример кода:
Кнопка Main.php link, чтобы начать действие:
<img src="$MyImageSource" onclick=\"ExpandDropdownDiv()\" />
Main.php javascript function ExpandDropdownDiv ():
function ExpandDropdownDiv(){ 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)/* && xmlhttp.status==200) */ { document.getElementById("divResults").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","Results.php",true); xmlhttp.send(); }
Пример кода Results.php:
<script type="text/javascript"> alert("Success"); </script> These Are The Results
—————— Редактировать – Обновить ——————
Простое предупреждение, из Results.php – всего лишь пример. Если бы мне удалось заставить это работать, я считаю, что смогу решить остальную часть своей проблемы самостоятельно. Тем не менее, я заметил несколько комментариев, предлагающих просто разместить предупреждение в javascript Main.php после того, как я установил innerHTML div. Итак, позвольте мне объяснить, что я действительно хочу сделать с javascript после установки div.
На рисунке 1 показаны некоторые нормальные элементы «Выбрать» html, которые были преобразованы с помощью jquery и расширения выпадающего списка (.js). Когда пользователь нажимает красочную стрелку вниз внизу, div расширяется, (изображение 2) и еще два элемента «Выбрать» генерируются внутри этого другого .php-файла … html возвращается и помещается в div. Таким образом, мне не нужно перезагружать всю страницу, и вы можете разместить новые выпадающие меню только под существующими.
Проблема состоит в том, что для «преобразования» этих нормальных элементов выбора существует некоторый javascript, который необходимо выполнить против этого HTML:
$(document).ready(function() { $(".MultiSelect").dropdownchecklist( {firstItemChecksAll: true, maxDropHeight: 300 , searchTextbox: true, width: 100, textFormatFunction: function(options) { var selectedOptions = options.filter(":selected"); var countOfSelected = selectedOptions.size(); var size = options.size(); switch(countOfSelected) { case 0: return "All"; case 1: return selectedOptions.text(); /* case size: return "All"; */ default: return countOfSelected + " selected"; } } } ); }
Итак, каким-то образом мне нужно иметь возможность запускать javascript против HTML, который создается из этого другого .php-файла. И просто вызывая вышеуказанный код, после того, как мои divs innerHTML заполнены, только повторно генерирует уже существующие выпадающие списки, а не два новых.
Примеры изображений
Вот хороший обзор о том, что вы делаете: Eval embed JavaScript Ajax: стиль YUI
Создание кода работает с помощью eval (); но его не рекомендуется по различным причинам:
Возьмем ваш php и изменим его следующим образом:
<script type="text/javascript"> function result() { alert("Success"); } </script> These Are The Results
и это функция обратного вызова от AJAX. результат (а); не выполняется, потому что он не получает оценку и, следовательно, не существует. которое в вашем случае
if (xmlhttp.readyState==4)/* && xmlhttp.status==200) */ { document.getElementById("divResults").innerHTML=xmlhttp.responseText; result(); // this function is embedded in the responseText // and doesn't get evaluated. Ie it doesn't exist }
аif (xmlhttp.readyState==4)/* && xmlhttp.status==200) */ { document.getElementById("divResults").innerHTML=xmlhttp.responseText; result(); // this function is embedded in the responseText // and doesn't get evaluated. Ie it doesn't exist }
для того, чтобы браузер распознал result();
вы должны сделать eval();
на всех операторах JavaScript с тегами сценария, которые вы ввели в div с id divResults
:
if (xmlhttp.readyState==4)/* && xmlhttp.status==200) */ { document.getElementById("divResults").innerHTML=xmlhttp.responseText; var myDiv = document.getElementById("divResults"); var myscripz = myDiv.getElementsByTagName('script'); for(var i=myscripz.length; i--;){ eval(myscripz[i].innerHTML); } result(); //alerts success }
аif (xmlhttp.readyState==4)/* && xmlhttp.status==200) */ { document.getElementById("divResults").innerHTML=xmlhttp.responseText; var myDiv = document.getElementById("divResults"); var myscripz = myDiv.getElementsByTagName('script'); for(var i=myscripz.length; i--;){ eval(myscripz[i].innerHTML); } result(); //alerts success }
Простой способ:
Самый простой способ сделать это – это в основном удалить JavaScript из php и отобразить содержимое, а после обратного вызова просто выполнить остальную часть JavaScript в функции обратного вызова php:
echo 'These Are The Results';
JavaScript:
xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4)/* && xmlhttp.status==200) */ { document.getElementById("divResults").innerHTML=xmlhttp.responseText; alert('success'); // or whatever else JavaScript you need to do } }
попробуйте обернуть javascript-код из Result.php в функцию и вызвать его после его вставки так:
<script type="text/javascript"> function result() { alert("Success"); } </script> These Are The Results
а также
if (xmlhttp.readyState==4)/* && xmlhttp.status==200) */ { document.getElementById("divResults").innerHTML=xmlhttp.responseText; if(result) result(); }
Ваш результат.php должен быть чем-то вроде …
echo 'eval("function results() { alert(\'success\'); }");';
А затем вызовите функцию результатов.