Implementing Ajax to verify whether a username exists based on jQuery_jquery

This article shares with you the implementation code of Ajax based on jQuery to verify whether the user name exists. Coders in need can refer to the source code of this article.

jQuery.ajax Overview

HTTP request to load remote data.

Implemented by jQuery underlying AJAX. For simple and easy-to-use high-level implementations, see $.get, $.post, etc. $.ajax() returns the XMLHttpRequest object it created. In most cases you will not need to manipulate this object directly, but in special cases it can be used to manually terminate the request.

$.ajax() has only one parameter: parameter key/value object, including each configuration and callback function information. See detailed parameter options below.
Note: If you specify the dataType option, please make sure the server returns the correct MIME information, (e.g. xml returns "text/xml"). Incorrect MIME types can cause unpredictable errors.

Note: If dataType is set to "script", then during remote requests (not under the same domain), all POST requests will be converted to GET requests. (Because the DOM script tag will be used to load)
In jQuery 1.2, you can load JSON data across domains. When using it, you need to set the data type to JSONP. When calling a function using JSONP format, such as "myurl?callback=?" jQuery will automatically replace ? with the correct function name to execute the callback function. When the data type is set to "jsonp", jQuery will automatically call the callback function.

Parameter list:

There are several Ajax event parameters here: beforeSend, success, complete, error. We can define these events to handle each of our Ajax requests well. Note that this in these Ajax events all points to the option information of the Ajax request (please refer to the picture of this when talking about the get() method).
Please read the above parameter list carefully. If you want to use jQuery for Ajax development, you must be familiar with these parameters.
Example:

1. Request page AJax.aspx

HTML code

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

JS code

<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

Backend code

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

The above is the entire content of this article, I hope it will be helpful to everyone’s study.