行業應用丨汙染源工況監管系統助力生態環境執法精準化
阿新 • • 發佈:2022-11-30
目錄
介紹
Ajax請求兩大特點和優點 非同步、區域性重新整理 bootcdn 中文文件 在這個地址可以獲jquery
區域性重新整理案例
- 模版
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> // 匯入jquery <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.1/jquery.js"></script> <style> .err{ color: red; } </style> </head> <body> <h3>註冊頁面</h3> <form action=""> <p>使用者名稱 <input type="text" class="user"> <span class="err"></span></p> </form> <script> // 定義一個匿名函式 繫結一個時間 失去焦點 觸發該匿名函式 $(".user").blur( function () { // 基於jquery傳送Ajax請求 $.ajax({ // 可以是絕對路徑 也可以是相對路徑 url: "/app01/username_auth/", // 請求方法 type:"post", // 請求資料 data: { "user":$(".user").val() }, // 發起Ajax請求成功後 響應回來的時候會觸發該匿名函式 success: function(res) { // 通過dom操作 將返回的資料渲染到區域性頁面 if (res.exist) { $(".err").html(res.msg) } else { $(".err").html("") } }, error: function(err) { } }) } ) </script> </body> </html>
- 檢視
def user_auth(request): user = request.POST.dict()["user"] select_user = User.objects.filter(name=user) res ={"exist":False,"msg":""} if select_user: res["exist"] = True res["msg"] = "使用者已存在" return JsonResponse(res)
非同步
比如說檢視有個強制等待10秒 瀏覽器位址列請求就要一值在哪等 Ajax請 他是不會影響其他操作 觸發請求後 不影響操作其他的