HTML文件
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script src="../../Scripts/jquery-3.4.1.min.js"></script> <script src="ajaxindex.js"></script> </head> <body> <input type="text" id="namevalue" /> <br /> <button id="btn">Send</button> 结果:<span id="result"></span> <!--加载片段--> </body> </html>
JS文件:
$(document).ready(function () { $("#btn").on("click", function () { $("#result").text("请求数据中,请稍后……");//防止延迟卡顿 $.get("Server.php", { name: $("#namevalue").val() },function (data) {//参数1:网址,参数2:参数,参数3:返回值 $("#result").text(data);//Ajax异步请求,只更新结果,不刷新页面 }).error(function () { $("#result").text("通讯失败!"); }); }); $("#btn").on("click", function () { $.post("Server.php", { name: $("#namevalue").val() }, function (data) {//参数1:网址,参数2:参数,参数3:返回值 $("#result").text(data);//Ajax异步请求,只更新结果,不刷新页面 }); }); //加载片段 $("body").text("wait……");//等待加载 $("body").load("HtmlPage1.htm", function (a, status, c) {//三个参数 console.log(status);//观察状态 if (status == "error") { $("body").text("加载失败"); } }); $.getScript("HelloJS.js").complete(function () {//加载JS文件 sayHello(); }); });
HTM文件:
<div style="width:100px;height:100px;background-color:#ff0000"></div>
HelloJS.JS文件:
function sayHello() {
alert("Hello AJAX!");
}
标签:jQuery,异步,function,text,AJAX,参数,result,data,加载 From: https://www.cnblogs.com/Mandy-ZQ-Ma/p/17375465.html