用於腳本加載的Ajax查詢僅運行一次
[英]Ajax query for script loading is running only once
問題描述
我有一個JavaScript腳本來發送ajax請求。 PHP腳本發送回文本，該文本將插入腳本標記中。 問題是它只能工作一次。 該腳本有效。 但是，當我在按鈕上執行其他操作時，腳本的結果不會更改（實際上，我的PHP腳本返回一個隨機數）。
我的代碼在這里。 我希望我清楚...
<script type="text/javascript">
$(function()
{
$('#submit').bind('click', function(){request(useData)});
});
// fonction pour la requête ajax
var xhr =null;
function request(callback)
{
if (xhr && xhr.readyState != 0)
{
xhr.abort(); // On annule la requête en cours !
}
// instanciation (globale) de l'objet pour l'envoi de la requête
xhr = getXMLHttpRequest();
xhr.onreadystatechange = function()
{
if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0))
{
callback(xhr.responseText);
document.getElementById("loader").style.display = "none";
}
else if (xhr.readyState < 4)
{
document.getElementById("loader").style.display = "inline";
}
};
// définition et protection des variables
var title = encodeURIComponent($('#title').val()) ;
// envoi
xhr.open('POST', 'generate.php', true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xhr.send('title=' + title);
// juste pour voir quand la requête a été executée - a enlever en prod
$('#test').text(Math.random()+title);
}
// fonction pour le traitement des éléments reçus
function useData(sData)
{
$('#scriptGraph').text(sData);
}
</script>
</head>
<body>
<script src="js/highcharts.js"></script>
<script src="js/modules/exporting.js"></script>
<input type="text" name="title" id="title">
<input type="submit" value="Update" id="submit">
<script id="scriptGraph" type="text/javascript"></script>
根據要求，我將PHP頁面的代碼添加到getXMLHttpRequest（）函數的代碼中。 PHP：
<?php
$title = $_POST['title'] ;
echo "alert('".$title.rand()."');" ;
?>
實例XHR的功能：
function getXMLHttpRequest() {
var xhr = null;
if (window.XMLHttpRequest || window.ActiveXObject) {
if (window.ActiveXObject) {
try {
xhr = new ActiveXObject("Msxml2.XMLHTTP");
} catch(e) {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
} else {
xhr = new XMLHttpRequest();
}
} else {
alert("Votre navigateur ne supporte pas l'objet XMLHTTPRequest...");
return null;
}
return xhr;
}
先感謝您！
3 個解決方案
解決方案1
1 已采納 2014-04-19 14:21:07
我發現了我的問題！ 我必須評估Ajax查詢的結果。
因此，我使用Ajax查詢結果的代碼是：
function useData(sData)
{
eval(sData);
}
我沒有嘗試，但是我認為另一種解決方案是：每次單擊按鈕時刪除腳本標記並創建一個新標記。
解決方案2
0 2014-04-19 13:40:09
當然，您正在中止AJAX對象
xhr.abort(); // on annule larequêteen cours！
解決方案3
0 2014-04-19 13:46:08
if (xhr && xhr.readyState != 0)
{
xhr.abort(); // On annule la requête en cours !
}
僅在第一次request not initialized時， readyState才為null。 嘗試使用該方法，盡管可能並非如此。
Ajax腳本加載/只顯示一次
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.