In this example program, I will use the $.ajax() method. You can also use the $.get() method, but I think $.ajax() is better. The code is easier to understand and not too complicated.
//Define the method of user name verification
function verify(){
//First test the button press on the page, you can call this method
//Use the alert method of javascript to display a pop-up prompt box
//alert("The button is Clicked! ! ");
//1. Get the content in the text box
//document.getElementById("userName"); //Jquery's way of finding nodes, A node can be found by adding # to the id attribute value in the parameter.
//jquery methods return jquery objects, and you can continue to execute other jquery methods on them
var jqueryObj = $("#userName");
//Get the value of the node
var userName = jqueryObj.val();
//alert(userName);
//2. Send the data in the text box to the servelt in the server segment
//In javascript, a simple Object definition method
var obj = {name: "123",age:20};
//Use jquery's XMLHTTPrequest object get request encapsulation
$.ajax({
type: " POST", //http request method
url: "AJAXXMLServer", //Server segment url address
data: "name=" userName, //Data sent to the server segment
dataType: "xml" , //Tell JQuery the data format to return
Success: callback //Define the callback function called when the interaction is completed and the server returns the data correctly
});
}
Callback function:
//Callback function
function callback (data) {
// alert("The data from the server segment is back!!");
//3. Receive the data returned by the server
//The data in the dom object data needs to be Parse it out
//First you need to convert the dom object into a JQuery object
var jqueryObj = $(data);
//Get the message node
var message = jqueryObj.children();
//Get text content
var text = message.text();
//4. Dynamically display the data returned by the server segment on the page
//Find the node that saves the result information
var resultObj = $("#result");
//Dynamicly change the content in the div node on the page
resultObj.html(text);
alert("");
}