Поиск в Ajax с помощью события jquery

108
9

Я хочу выполнить поиск в Login с помощью Ajax, поэтому мне не нужно обновлять страницу и использовать событие jquery вот код, но он не работает :(

 $(document).ready(function(){
$("#login").keyup(submitForm);

});
function submitForm()
{
var xhr= new XMLHttpRequest();
xhr.onreadystatechange=function()
{

if (xhr.readyState==4 && xhr.status==200)
{
document.getElementById("zone").innerHTML=xhr.responseText;
}
}
var str="SearchLogin.php?login="+document.getElementById("login").value;

xhr.open("GET",str,true);
xhr.send();
}

ценить это

спросил(а) 2021-01-25T14:53:21+03:00 5 месяцев назад
1
Решение
63

Вместо этого я использовал бы функцию jquery $.ajax:

function submitForm(){
$.ajax({
method: 'GET',
url: 'SearchLogin.php',
data: {
login: $('#login').val()
}
}).done(function(response){
$('#zone').html(response);
});
}

Вы можете проверить вывод с помощью console.log(response) с firebug в функции.done. Firebug также полезен, потому что вы можете использовать консоль, чтобы узнать, найдена ли она на странице, если она была успешно отправлена, если данные были отправлены обратно и т.д. Просто нажмите запрос и вы сможете просмотреть все детали. Я бы рекомендовал проверить его, повторив "Hello World" на скрипте на стороне сервера, чтобы увидеть, работает ли соединение.

ответил(а) 2021-01-25T14:53:21+03:00 5 месяцев назад
63

У вас очень странное сочетание jQuery и JavaScript. Если вы используете jQuery, было бы легче придерживаться этого. Существует функция jQuery AJAX, которая может быть проще, чем использование функции JavaScript. См. Документацию здесь: http://api.jquery.com/jQuery.ajax/

Если я помещаю ваш код в функцию jQuery вместо использования JavaScript AJAX:


function submitForm()
{
$.ajax({
url: "SearchLogin.php?login="+$('#login').attr('value'),
}).done(function(response) {
$('#zone').innerHTML = response;
});
}

Это помогает немного прояснить ситуацию?

ответил(а) 2021-01-25T14:53:21+03:00 5 месяцев назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема