Implémentation d'Ajax pour vérifier si un nom d'utilisateur existe basé sur jQuery_jquery

Cet article partage avec vous le code d'implémentation d'Ajax basé sur jQuery pour vérifier si le nom d'utilisateur existe. Les codeurs qui en ont besoin peuvent se référer au code source de cet article.

Présentation de jQuery.ajax

Requête HTTP pour charger des données distantes.

Implémenté par jQuery sous-jacent à AJAX. Pour des implémentations de haut niveau simples et faciles à utiliser, voir $.get, $.post, etc. $.ajax() renvoie l'objet XMLHttpRequest qu'il a créé. Dans la plupart des cas, vous n'aurez pas besoin de manipuler cet objet directement, mais dans des cas particuliers, il peut être utilisé pour terminer manuellement la requête.

$.ajax() n'a qu'un seul paramètre : le paramètre clé/valeur de l'objet, comprenant chaque information de configuration et de fonction de rappel. Voir les options de paramètres détaillées ci-dessous.
Remarque : Si vous spécifiez l'option dataType, assurez-vous que le serveur renvoie les informations MIME correctes (par exemple, xml renvoie "text/xml"). Des types MIME incorrects peuvent provoquer des erreurs imprévisibles.

Remarque : Si dataType est défini sur "script", alors lors des requêtes distantes (pas sous le même domaine), toutes les requêtes POST seront converties en requêtes GET. (Car la balise du script DOM sera utilisée pour le chargement)
Dans jQuery 1.2, vous pouvez charger des données JSON sur plusieurs domaines. Lorsque vous l'utilisez, vous devez définir le type de données sur JSONP. Lors de l'appel d'une fonction au format JSONP, telle que "myurl?callback=?", jQuery remplacera automatiquement ? par le nom de fonction correct pour exécuter la fonction de rappel. Lorsque le type de données est défini sur "jsonp", jQuery appellera automatiquement la fonction de rappel.

Liste des paramètres :

Il existe plusieurs paramètres d'événement Ajax ici : beforeSend, success, complete, error. Nous pouvons définir ces événements pour bien gérer chacune de nos requêtes Ajax. Notez que dans ces événements Ajax, tous pointent vers les informations d'option de la requête Ajax (veuillez vous référer à l'image de ceci lorsque vous parlez de la méthode get()).
Veuillez lire attentivement la liste des paramètres ci-dessus. Si vous souhaitez utiliser jQuery pour le développement Ajax, vous devez être familier avec ces paramètres.
Exemple :

1. Page de demande AJax.aspx

Code HTML

<div> 
<input id="txtName" type="text" /><input type="button" value="查看用户名是否存在" id="btn" onclick="JudgeUserName();" /> 
<div id="showResult" style="float:left">div> 
div> 

Code JS

<script type="text/javascript" src="CSS/jquery-1.3.2.js"></script> 
<script type="text/javascript"> 
function JudgeUserName() 
{ 
$.ajax({ 
type:"GET", 
url:"AjaxUserInfoModify.aspx", 
dataType:"html", 
data:"userName="+$("#txtName").val(), 
beforeSend:function(XMLHttpRequest) 
{ 
$("#showResult").text("正在查询"); 
//Pause(this,100000); 
}, 
success:function(msg) 
{ 
$("#showResult").html(msg); 
$("#showResult").css("color","red"); 
}, 
complete:function(XMLHttpRequest,textStatus) 
{ 
//隐藏正在查询图片 
}, 
error:function() 
{ 
//错误处理 
} 
}); 
} 
</script> 

2, page AjaxUserInfoModify.aspx

Code backend

protected void Page_Load(object sender, EventArgs e) 
{ 
string userName = Request.QueryString["userName"].ToString (); 
if (userName == "James Hao") 
{ 
Response.Write ("用户名已经存在！"); 
} 
else 
{ 
Response.Write ("您可以使用此用户名！"); 
} 
} 

Ce qui précède représente l’intégralité du contenu de cet article, j’espère qu’il sera utile à l’étude de chacun.