Проблемы с запуском AJAX

Question

Проблемы с запуском AJAX

Я пытался отправить запрос php без перезагрузки с помощью ajax. Однако я не думаю, что понимаю Ajax хорошо. Я попытался посмотреть пример кода w3school и попытался найти решение для этого:

<script>
function loadDoc() {
var xhttp = new XMLHttpRequest();
xhttp.open("GET", "led.php?state=1", true);
xhttp.send();
</script>

<button class="button" onclick = "loadDoc()">LED ON</button>

</br>
</br>
<script>
function loaddoc() {
var xhttp = new XMLHttpRequest();
xhttp.open("GET", "led.php?state=0", true);
xhttp.send();
</script>

<button class="button" onclick "loaddoc()">LED OFF</button>

Я, честно говоря, не знаю, где я иду не так. Когда я нажимаю кнопку, php-запрос отправляется. Но сейчас это явно не работает.

Кто-нибудь может помочь?

С уважением

Код PHP:

<?php

$onoffdata = $_GET["state"];

$textfile = "LED_data.txt";
$fileLocation = "$textfile";
$fh = fopen($fileLocation, 'w') or die("Error opening file!");

$stringToWrite = "$onoffdata";
fwrite($fh,$stringToWrite);

fclose($fh);

header("Location:index.html");
?>

0

ajax jquery php

Решение

Другие решения

На вашем led.php положите код <?php $_GET['state'];?> затем откройте инспектор браузеров и перейдите на вкладку сети, справа вы увидите вкладку предварительного просмотра, которая вернет то, что led.php выведет в вашем случае, 1 или 0

0

Сначала проверьте, что led.php работает как задумано, перейдя в led.php? State = 1. это для проверки того, что страница не умирает. Если страница не умирает, откройте файл и убедитесь, что на нем написано: 1. используя приведенный ниже код, попробуйте отключить светодиод, а затем проверьте содержимое файла, надеюсь, оно должно быть 0.

<script>
function setState(state) {
var xhttp = new XMLHttpRequest();
xhttp.open("GET", "led.php?state="+state, true);
xhttp.send();
}
</script>

<button type="button" class="button" onclick="setState(1)">LED ON</button>

</br>
</br>

<button type="button" class="button" onclick="setState(0)">LED OFF</button>

0

Источник

Accepted Answer

«Честно говоря, я не знаю, где я иду не так …» => Вы на самом деле делаете только часть работы там. Итак, позвольте мне вернуться немного назад:
Чтобы разбить жизненный цикл XMLHttpRequest на этапы, вам необходимо:

Создание объекта XMLHttpRequest; что ты сделал со своим var xhttp = ... назначение.
Добавить прослушиватель событий. Это то, где вы в основном говорите, что делать на каждом этапе state здесь) сделать ваш запрос для вас. В итоге, здесь есть пять readyStates Вы могли бы слушать. Узнать больше Вот
Инициируйте запрос, который вы сделали с xttp.open(...)
Затем вы отправляете запрос. Это то, что вы сделали со своим xttp.send() как вы уже догадались.

Итак, вернемся к шагу, который вам не хватает.

xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("demo").innerHTML =
this.responseText;
}
};

Вы хотите сделать это между var http = ... и ваш xhttp.open,

Этот кусок в основном говорит «эй xttp всякий раз, когда ваш readyState изменения (от 0 до 4), выполнить эту функцию. Теперь сама функция довольно проста в этом случае, однако обратите внимание на условные.
this.readyState == 4 проверяет, является ли запрос done — вот тогда вы получите свой полный response

А ТАКЖЕ

this.status == 200 проверяет, все ли хорошо. Вы можете искать http status codes для различных значений status может быть.

Короче говоря, эта проверка должна гарантировать, что запрос завершен и все прошло хорошо, прежде чем пытаться что-то делать с responseText, В этом W3Schools пример, они устанавливают innerHTML элемента в DOM на то, что было возвращено с сервера. По сути дела что-то делать с результатом запроса xmlhttp. В своем фрагменте кода вы только отправляете запрос и не слушаете ответ, не говоря уже о том, чтобы что-то с ним сделать.

Надеюсь, это поможет.

1