Django中用Jquery实现不刷新页面进行身份验证和计算器功能

1.下载jquery

http://www.jq22.com/jquery-info122

下载解压之后加入工程中的static文件夹中

2.路由分发。

"""Django_demo1 URL ConfigurationThe `urlpatterns` list routes URLs to views. For more information please see:https://docs.djangoproject.com/en/2.1/topics/http/urls/
Examples:
Function views1. Add an import:  from my_app import views2. Add a URL to urlpatterns:  path('', views.home, name='home')
Class-based views1. Add an import:  from other_app.views import Home2. Add a URL to urlpatterns:  path('', Home.as_view(), name='home')
Including another URLconf1. Import the include() function: from django.urls import include, path2. Add a URL to urlpatterns:  path('blog/', include('blog.urls'))
"""
from django.contrib import admin
from django.urls import path
from app01.views import classes, students , teachers
from app01.views import ajax# from django.urls import re_pathurlpatterns = [path('admin/', admin.site.urls),path('classes.html/', classes.get_classes),path('add_classes', classes.add_classes),path('del_classes', classes.del_classes),path('edit_classes', classes.edit_classes),path('students.html/', students.get_students),path('add_students', students.add_students),path('del_students', students.del_students),path('edit_students', students.edit_students),path('teachers.html/', teachers.get_teachers),path('cls_add_teachers', classes.cls_add_teachers),path('ajax1.html', ajax.ajax1),path('ajax2.html', ajax.ajax2),path('ajax3.html', ajax.ajax3),
]

3.views文件夹中创建ajax视图函数ajax.py

from django.shortcuts import render, redirect, HttpResponsedef ajax1(request):return render(request, 'ajax1.html')def ajax2(request):user = request.GET.get('username')pwd = request.GET.get('password')import timetime.sleep(5)return HttpResponse('ok')# return render(request, 'ajax2.html')def ajax3(request):try:v1 = request.POST.get('v1')v2 = request.POST.get('v2')print(v1, v2)answer = int(v1) + int(v2)except Exception as e:answer = '输入格式错误！'return HttpResponse(answer)

4.在模板中添加ajax1.html文件

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><style>.btn{display: inline-block;padding: 5px 15px;background-color: darkgoldenrod;color: white;cursor:pointer;}</style>
</head>
<body><div><input  placeholder="用户名" type="text" id="username"><input placeholder="密码" type="password" id="password"><div class="btn" οnclick="submitForm()">提交</div></div><div><input  placeholder="v1" type="text" id="v1" name="v1"><input placeholder="v2" type="text" id="v2" name="v2"><div class="btn" οnclick="add_function()">相加等于</div><input placeholder="answer" type="text" id="answer"></div><script src="/static/jquery-3.3.1.js"></script><script>function submitForm(){var u = $('#username').val()var p = $('#password').val()console.log(u,p)$.ajax({url:'/ajax2.html',type:'GET',data:{username:u, password: p},success:function (arg){console.log(arg)}})}function add_function(){var add1 = $('#v1').val()var add2 = $('#v2').val()console.log(add1,add2)$.ajax({url:'/ajax3.html',type:'POST',data:{'v1': add1, 'v2': add2},success:function (arg){console.log(arg)$('#answer').val(arg)}})}</script>
</body>
</html>

转载于:https://www.cnblogs.com/CK85/p/10199074.html

Django中用Jquery实现不刷新页面进行身份验证和计算器功能相关推荐

jquery.cookie实现刷新页面复选框选定状态不变
①添加需要的js文件 jquery.cookie.js必不可少. <SCRIPT type="text/javascript" src="js/jquery.coo ...
【Asp.Net】：如何处理大量页面的身份验证跳转
为了在多个页面中添加身份验证的跳转,我们一般都会选择在每个页面都编辑跳转代码,但当页面非常多的时候,工作量是非常大的.这里提供了一种新思路,为这些页面拥有的类添加一个父类,使其派生自某个类.由于Pag ...
ajax返回不刷新页面,Jquery ajax不刷新页面提交action取得返回值
页面采用回调函数function(data) 处理后台返回的结果 a标签onclick事件触发加入秒杀前台function addproduct(id){ var mprice=document.g ...
ASP.Net中无刷新执行Session身份验证
在写一个客户的B/S结构应用程序时,突然发现一个技巧,不知道是否是MS的一个BUG,给相关的有研究的朋友原先考虑写一个检查Session的类,Session失效后,必须转向登陆页面,可每一个调用该类的 ...
站点页面身份验证问题
做网站时往往需要在每个页面验证用户是否已登录,若没登录系统就重定向到登录页面.这个验证的过程在哪做呢?初学者最常用的方法就是在每个页面的Page_Load事件中进行session中用户的验证,即如下代 ...
刷新页面时间不重置前端倒计时_brackets：前端开发工程师必备编辑器之一
Brackets介绍最近开始使用一个新的编辑器,是Adobe开发的开源的项目,与Sublime Text2相比有两点优势: 可以实时预览: 可以快速编辑,在HTML可以编辑CSS和JS代码. Ado ...
对jQuery和Ajax使用基本身份验证
我正在尝试通过浏览器创建基本身份验证,但我真的无法到达那里. 如果此脚本不在此处,则浏览器身份验证将接管,但是我想告诉浏览器用户即将进行身份验证. 地址应类似于: http://username:pa ...
java登录密码验证失败_java – Spring Security：如果身份验证失败,则重定向到登录页面...
我们有两种登录方式. >用户名和密码由请求标头中的其他应用程序发送.检查IT,如果用户名和密码正确,则进入.[为此编写自定义过滤器] >如果请求标头中不存在用户名和密码,则会显示登录屏幕. ...
js中ajax刷新页面,django+js+ajax实现刷新页面的方法
本文实例讲述了django+js+ajax实现刷新页面的方法.分享给大家供大家参考,具体如下: 在服务器开发的时候,为了方便将服务器对外开一个接口来操作,可以使用django制作网页,通过页面来操作服 ...

Django中用Jquery实现不刷新页面进行身份验证和计算器功能

Django中用Jquery实现不刷新页面进行身份验证和计算器功能相关推荐

最新文章

热门文章