Home > Article > Web Front-end > Code example of native javascript implementing AJAX
The content of this article is about code examples for implementing AJAX in native JavaScript. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.
Native JS uses AJAX code, the code is as follows
var xhr1 = new XMLHttpRequest; xhr1.open("POST", 'http://47.92.121.171:17788', true); xhr1.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); xhr1.onreadystatechange = function () { if (xhr1.readyState == 4 && xhr1.status == 200) { console.log("打印用户信息1" + xhr1.responseText); } } xhr1.send("code=p_001&name=aaaaaa&pas=123456&belong=aabbccdd");
If you need to call the result after the ajax running method is completed, you need to use a callback function or promise
Callback function
private loadXMLDoc(url, sendcode, cfunc) { this.xmlhttp = new XMLHttpRequest; this.xmlhttp.open("POST", url, true); this.xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); this.xmlhttp.onreadystatechange = cfunc; this.xmlhttp.send(sendcode); } private myFunction() { this.loadXMLDoc("http://47.92.121.171:17788", "code=p_001&name=aaaaaa&pas=123456&belong=aabbccdd",()=>{ if (this.xmlhttp.readyState == 4 && this.xmlhttp.status == 200) { console.log("3") console.log("打印用户信息1" + this.xmlhttp.responseText) } }); }
Use promise
this.getGameServer().then(function (res) { console.log("res" + res); }).catch(function (rej) { console.log("rej" + rej); });private getGameServer() { return new Promise(function (resolve, reject) { var xhr = new XMLHttpRequest; xhr.open("POST", 'http://47.92.121.171:9002/rout/get_game_servers', true); xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); xhr.onreadystatechange = function () { if (xhr.readyState == 4 && xhr.status == 200) { resolve(xhr.responseText); } } xhr.send("game=1&shang=common"); }); }
The above is the detailed content of Code example of native javascript implementing AJAX. For more information, please follow other related articles on the PHP Chinese website!