Maison > interface Web > js tutoriel > Comment implémenter le statut de la demande d'interrogation Ajax

Comment implémenter le statut de la demande d'interrogation Ajax

php中世界最好的语言
Libérer: 2018-04-03 15:18:32
original
3098 Les gens l'ont consulté

Cette fois, je vais vous montrer comment mettre en œuvre le statut de demande de sondage Ajax. Quelles sont les précautions pour mettre en œuvre le statut de demande de sondage Ajax. Voici un cas pratique, jetons un coup d'œil.

La fonction à mettre en œuvre ici est de se connecter au site en scannant le code QR du compte officiel WeChat avec les paramètres.

Mais évidemment, si ajax demande le serveur en continu, cela augmentera la charge sur le serveur, donc cet exemple utilise setInterval de js pour appeler et exécuter périodiquement une fonction ajax pour demander des données au serveur, mais utilisez le clearinterval fonction pour effacer le minuteur lorsque la demande est réussie ou n'a pas réussi après un certain nombre de demandes. Le

code et les commentaires sont les suivants : (Le backend est implémenté à l'aide de thinkPHP, donc le code js contient quelques règles de syntaxe thinkPHP)

<script type="text/javascript" src="CSS/bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
<script type="text/javascript">
var uid = "{$uid}";
var i = 0;
var timer;
$().ready(function(){
//打开扫码登录模态框
$('#login').click(function(){
//如果用户已经登录,则返回
if(uid){ 
return ;
}
//打开模态框,通过remote选项从远程加载数据
$('#loginModel').modal({
remote: "{:U('user/login')}"
});
});
//模态框隐藏之后清空数据
$("#loginModel").on("hidden.bs.modal", function() {
$(this).removeData("bs.modal");
});
//当模态框显示出来后,通过定时返回来向服务器请求数据,定时器是每三秒请求一次服务器
$('#loginModel').on('shown.bs.modal', function (e) {
timer = setInterval(ajax_request, 3000);
});
});
//ajax 请求函数,
function ajax_request(){
i++;
//如果已经请求20此没有请求成功,则强制结束,给出提示信息,因为每3s调用一次,供调用20次,大概就是一分钟的时间
if(i > 20){
$('.login_info1').html('<span style="color:red;">登录超时,如需登录请刷新页面~</span>');
clearInterval(timer);
return ;
}
$.ajax({
type: "post",
url: "{:U('User/login_qrcode')}",
timeout : 3000,
data: { "scene_id": $('#scene_id').val() },
success: function (msg){ 
if(1 == msg.status){
$('.login_info1').html('<span style="color:#0C9;">'+msg.info+'</span>');
setTimeout(refresh, 3000);
return ;
}
},
error: function(){
}
});
}
//重载页面
function refresh(){
location.reload();
}
</script>
Copier après la connexion

Je vous crois Je lirai le cas dans cet article. Vous maîtrisez la méthode. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Ajax+mysq réalise une liste de liaison à trois niveaux de provinces et de municipalités

Ajax transmet Json et données xml Explication détaillée des étapes (avec code)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal