html webservice数据交互_HTML5请求响应webservice

I am pretty new to html5 web development

I have created a page with login and password on it and have a submit button.

On submit , I send a rest request to the server which has a url

THE RRQUEST IS SOMETHING LIKE THIS

abc

loooik

which is in js file as var data...

This request is set as

var parameters=JSON.stringify(data);

I use the following code for establishing connection

xmlHttp.open("post",url,true);

XmlHttp.setRequestHeader("Content-type","application/json);

xmlHttp.send(parameters);

xmlHttp.onreadystatechange=function X()

{

if(xmlHttp.readyState==4)

{

alert(xmlHttp.responseText);

}

}

return true;

}

I need to add a loading element and want to display the next screen between request and the response. How can I achieve it?

In tag I have used submit input type where onClick attribute calls return sendPost() method which has the request to be called

How should I proceed for the same... having loading screen and getting the response ... suppose just the name to be displayed on next html screen

解决方案

First of all see basic jQuery example. This will guide you through how jQuery works and help a lot in the solution I'm going to suggest.

jQuery has it's own AJAX method and further shorthand called $.post

Now you can write something like this -

function requestNetwork() {

// Code for loading screen

$.ajax({

url: "yourURL",

data: "yourData"

}).done(function(data) {

alert(xmlHttp.responseText);

// Code for dismissing loading screen

}).fail(function(data) {

// Code when call fails

}).always(function() {

// This code will always run

});

}