<script src="http://code.jquery.com/jquery-latest.js"></script>#引入jQuery
#当点击函数为test()的按钮时触发ajax请求，url为请求路径，dataType为数据类型，type默认为get可以不写
<script>
function test() {
$.ajax({
'url': '/ajax_handle',
'dataType': 'json',
'async':false,#默认是异步的（true是异步的）
}).success(function (data) {
alert(data.res)
})
}
</script>
#在urls里设置
url('^ajax_handle$', views.ajax_handle),
#在views视图里设置
def ajax_handle(request):
return JsonResponse({'res': 111})
用ajax登录用户名密码方案
#以下为前端html中的代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>login</title>
<style>
#message {
display: none;
color: red;
}
</style>
</head>
<body>
<form action="/login/" method="post">
<input type="text" id="username" >
<input type="password" id="password">
<input type="button" value="登录" onclick="login()">
</form>
<div id="message"></div>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
function login() {
username = $('#username').val()
password = $('#password').val()
$.ajax({
'url': '/login/',
'type': 'post',
'dataType': 'json',
'data':{'username': username, 'password': password}
}).success(function (data) {
if (data.res == 0){
$('#message').show().html('用户名密码错误！！！')
}
else {
location.href = '/index' #跳转/index页面
}
})
}
</script>
</body>
</html>
#后端views里代码
def login(request):
if request.method == 'POST':
username = request.POST.get('username')
password = request.POST.get('password')
if username == 'root' and password == 'lizhaoqwe':
return JsonResponse({'res': 1})#1表示登录成功
else:
return JsonResponse({'res': 0})#0表示登录失败
return render(request, 'login.html')