Ответ AJAX возвращает текущую страницу

Question

Я искал аналогичную проблему некоторое время, но ни одно из решений не работало для меня (и я не мог найти точно такую ​​же проблему).

Прежде всего, сайт, над которым я работаю, работает на Zend Framework. Я подозреваю, что это имеет какое-то отношение к проблеме.

Я хочу сделать довольно простые функции AJAX, но по какой-то причине мой ответ всегда равен html текущей страницы. Мне не нужна какая-либо функциональность Zend, функции, которые мне нужно реализовать, могут (и я предпочел бы их) работать отдельно от фреймворка.

Для целей тестирования я сделал все как можно проще, и все же я не могу найти ошибку. У меня есть страница «test.php», которая имеет только ссылку, которая запускает вызов ajax. Вот как выглядит этот призыв:

$('.quiz-link').click(function(e){ 
    e.preventDefault(); 
    $.ajax({ 
     URL: "/quiz_api.php", 
     type: "POST", 
     cache: false, 
     data: { 
      'test': 'test' 
     }, 
     success: function(resp){ 
      console.log(resp); 
     }, 
     error: function(resp){ 
      console.log("Error: " + reps); 
     } 
    }); 
}); 

И это quiz_api.php просто:

<?php 
    echo "This is a test"; 
?> 

Когда я щелкаю по ссылке я получаю весь HTML текущей страницы. «Это тест» не может быть найден там. Я также получаю сообщение об ошибке: «Синхронный XMLHttpRequest в основном потоке устарел из-за его пагубных последствий для пользователя конечного пользователя. Для получения дополнительной справки отметьте http://xhr.spec.whatwg.org/».

Я считаю, что это связано с файлами JS, которые включены в этот ответ HTML, но я также попытался установить «async: true», и это не помогло.

Я хотел бы избежать использования функций Zend Framework для этой задачи, потому что я не очень хорошо знаком с этим, и даже создание простого контроллера звучит довольно болезненно. Вместо этого я хочу узнать, что вызывает такое поведение, и посмотреть, можно ли его изменить.

PS: Я также попытался переместить quiz_api.php в другой домен, но ничего не изменил.

Answer 1

Я знаю, что это может быть старый код, но он работает, прост и очень адаптирован. Вот что я придумал. Надеюсь, это сработает для вас.

//Here is the html 
<a href="#" id="test" onclick="test()">Link Test</a> 
<div id="test_div"></div> 

function test(){ 
// Create our XMLHttpRequest object 
var hr = new XMLHttpRequest(); 
// This is the php file link 
var url = "quiz_api.php"; 
// Attaches the variables to the url ie:var1=1&var2=2 etc... 
var vars = ''; 
hr.open("POST", url, true); 
//Set content type header information for sending url encoded variables in the request 
hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
// Access the onreadystatechange event for the XMLHttpRequest object 
hr.onreadystatechange = 
function(){ 
    if(hr.readyState == 4 && hr.status == 200){ 
     var return_data = hr.responseText; 
      console.log(return_data); 
      document.getElementById('test_div').innerHTML = return_data; 
    }else{ 
     document.getElementById('test_div').innerHTML = "XMLHttpRequest failed"; 
    } 
} 
//Send the data to PHP now... and wait for response to update the login_error div 
hr.send(vars); // Actually execute the request 
} 

вы можете изменить всю страницу с document.write вместо изменения индивидуального «DIV» s