Не срабатывает часть кода
Сразу же извиняюсь, так как нуб.
Имеется код: <script type="text/javascript"> $(function(){ $("a#load").click(function(){ $(this).after("<div class='loader' id='loader'></div>").fadeIn(); }); }); function LoadInfo() { var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { document.getElementById("LoadInformation").innerHTML = this.responseText; document.getElementById("loader").style.display = "none"; } }; xhttp.open("POST", "test.php", true); xhttp.send(data); } </script> И кусок PHP: if ($_POST) { echo('<a id="load" onclick="LoadInfo()">Click</a><br />'); # link 2 exit; } # тут javascript echo('<a id="load" onclick="LoadInfo()">Click</a><br />'); # link 1 echo('<p id="LoadInformation"></p>'); При нажатии на link 1 появляется картинка, которая играет, пока не будет получен ответ по POST запросу. Получаем точно такой же линк link 2, в котором отрабатывает onclick="LoadInfo()" и оправляет запрос, а вот картинка не появляется уже. Почему так? |
Готов заплатить за помощь в вопросе.
|
Вот эта штука у элементов id="load" является уникальной, нельзя на странице плодить множество с одним и тем же id.
$("a#load").click ... этот обработчик установлен только для элемента на странице, для того что добавляется потом нет. Иметь обработчик $("a#load").click и еще и onclick="LoadInfo()", это бессмыслица. Коли все элементы вставляются в LoadInformation, значит делегировать ему обработку, выбросив нативный вызов onclick="LoadInfo()", заменив id на имя класса, и удалив id у класса loader: $(function(){ $("#LoadInformation").on('click', 'a.load', function(){ $(this).after("<div class='loader'></div>").fadeIn(); LoadInfo(); }); }); |
Понял. Работает! Правда линк пришлось внутрь LoadInformation поставить. Но так даже лучше.
echo('<p id="LoadInformation"><a class="load">Click</a></p>'); А как передать какие-то параметры линком, чтобы после их обработать с помощью LoadInfo(var1,var2)? |
<a class="load" id="first">Click</a> <a class="load" id="second">Click</a> var action = $('.load').attr('id'); LoadInfo(action); Вроде работает. Ошибок тут нету? |
Нет.
|
$("#LoadInformation").on('click', 'a.load', function(){ А как это переписать, если внутри LoadInformation будет несколько div и form по пути до a.load? То есть примерно в таком варианте: echo('<p id="LoadInformation"><div><form><div><a class="load" id="first">Click</a></div></form></div></p>'); Не получается поймать событие. Да и количества внутренних div может быть разным. |
<p id="LoadInformation"><div> - не делайте такого. А о ID уже говорилось, что это уникальное значение, нельзя в блок "#LoadInformation", вставлять еще один блок "#LoadInformation". А сколько будет в блоке ссылок и как глубоко они будут спрятаны, для делегирования это не играет роли.
|
Видимо мы друг-друга не поняли.
Есть только один блок "#LoadInformation". Подгружается другая информация, без "#LoadInformation" разумеется. Заменил p на div - все работает. |
Часовой пояс GMT +3, время: 16:55. |