【Django】ajax和django接口交互(获取新密码)

文章目录

    • 一、需求
      • 1. 效果图
    • 二、实验
      • 1. 写get接口后端
      • 2. 写html后端
      • 3. 写前端
      • 4. 测试

一、需求

1. 效果图

在这里插入图片描述

二、实验

1. 写get接口后端

  • 写views
import string
import random
def getnewpwd(request):words = list(string.ascii_lowercase+string.ascii_uppercase+string.digits+string.punctuation)random.shuffle(words)result = "".join(words[:20])return HttpResponse(result)
  • 写urls

urlpatterns = [path("getnewpwd/",views.getnewpwd),
]
  • 测试后端接口
    在这里插入图片描述

2. 写html后端

  • 写views
def getnewpwdhtml(request):return render(request,"getnewpwd.html",{})
  • 写urls
urlpatterns = [path("getnewpwdhtml/",views.getnewpwdhtml),
]

3. 写前端

{% load static %}
<!DOCTYPE html>
<html lang="zh-CN"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><link rel="stylesheet"href="{% static "antapp/bootstrap/bootstrap.min.css" %}"><title>Document</title></head><body><div class="row" style="margin-top: 20px;margin-left: 40px;"><button type="button" id="getnewpwd" class="btn btn-success" style="margin-left: 5px;">获取新密码</button></div><div class="row"  style="margin-top: 20px; margin-left: 40px;"><div id="shownewpwd" class="alert alert-primary" role="alert"> </div></div><script src="{% static "antapp/bootstrap/jquery.min.js" %}"></script><script src="{% static "antapp/bootstrap/bootstrap.bundle.min.js" %}"></script><script>$(function(){$("#getnewpwd").click(function(){$.ajax({url:"/getnewpwd/",type:"get",success:function(result){$("#shownewpwd").html(result)}})})})</script></body>
</html>

4. 测试

在这里插入图片描述

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/49919.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

大模型算法面试题(十三)

本系列收纳各种大模型面试题及答案。 1、微调后的模型出现能力劣化&#xff0c;灾难性遗忘是怎么回事 微调后的模型出现能力劣化&#xff0c;灾难性遗忘&#xff08;Catastrophic Forgetting&#xff09;是一个在机器学习领域&#xff0c;尤其是在深度学习和大模型应用中频繁出…

特斯拉财报看点:FSD拳打华为,Robotaxi 脚踢百度

大数据产业创新服务媒体 ——聚焦数据 改变商业 特斯拉发最新财报了&#xff0c;这不仅是一份财务报告&#xff0c;更是一张未来发展的蓝图。在这份蓝图中&#xff0c;两个关键词格外耀眼——FSD&#xff08;全自动驾驶系统&#xff09;和Robotaxi&#xff08;无人驾驶出租车&…

探索科技新境界,体验系统维护的极致自由—蓝屏工具箱4.0全新登场

官网&#xff1a;蓝屏工具箱官网 下载链接&#xff1a;蓝屏工具箱最新版安装包官方版下载 在数字化浪潮席卷全球的今天&#xff0c;软件工具已不仅仅是简单的代码集合&#xff0c;它们如同工匠手中的雕刻刀&#xff0c;精细打磨、雕琢着数字世界的每一个角落。创峄公司深谙此道…

基于多种机器学习算法的短信垃圾分类模型

文章目录 有需要本项目的代码或文档以及全部资源&#xff0c;或者部署调试可以私信博主导入第三方库读取数据数据预处理数据分析与可视化机器学习建模贝叶斯逻辑回归支持向量机随机森林XGBoost总结每文一语 有需要本项目的代码或文档以及全部资源&#xff0c;或者部署调试可以私…

【数据结构初阶】单链表经典算法题十二道——得道飞升(中篇)

hi&#xff0c;bro—— 目录 5、 链表分割 6、 链表的回文结构 7、 相交链表 8、 环形链表 【思考】 —————————————— DEAD POOL —————————————— 5、 链表分割 /* struct ListNode {int val;struct ListNode *next;ListNode(int x) : val(x), …

学懂C语言(十八):C语言中数组及其应用

目录 一、数组的概念 二、数组的声明、初始化及访问 1、声明 2、初始化 3、访问数组元素 三、数组的应用 1. 存储和处理数据 2. 字符串处理 3. 多维数组 4. 函数参数 5、注意事项 一、数组的概念 C语言中的数组是一种数据结构&#xff0c;用于存储一…

el-image预览图片点击遮盖处关闭预览

预览关闭按钮不明显 解决方式&#xff1a; 1.修改按钮样式明显点&#xff1a; //el-image 添加自定义类名&#xff0c;下文【test-image】代指 .test-image .el-icon-circle-close{ color:#fff; font-size:20px; ...改成很明显的样式 }2.使用事件监听&#xff0c;监听当前遮…

web前端开发一、VScode环境搭建

1、VScode安装live server插件&#xff0c;写完代码后&#xff0c;保存就会在浏览器自动更新&#xff0c;不需要再去浏览器点击刷新了 2、创建html文件 3、在文件中输入感叹号 &#xff01; 4、选择第一个&#xff0c;然后回车&#xff0c;就会自动输入html的标准程序 5、…

我在百科荣创企业实践——简易函数信号发生器(6)

对于高职教师来说,必不可少的一个任务就是参加企业实践。这个暑假,本人也没闲着,报名参加了上海市电子信息类教师企业实践。7月8日到13日,有幸来到美丽的泉城济南,远离了上海的酷暑,走进了百科荣创科技发展有限公司。在这短短的一周时间里,我结合自己的教学经验和企业的…

20240724-然后用idea创建一个Java项目/配置maven环境/本地仓储配置

1.创建一个java项目 &#xff08;1&#xff09;点击页面的create project&#xff0c;然后next &#xff08;2&#xff09;不勾选&#xff0c;继续next &#xff08;3&#xff09;选择新项目名称&#xff0c;新项目路径&#xff0c;然后Finsh&#xff0c;在新打开的页面选择…

IDEA在编译的时候报Error: java: 找不到符号符号: 变量 log lombok失效问题

错误描述 idea因为lombok的报错: java: You arent using a compiler supported by lombok, so lombok will not work and has been disabled.Your processor is: com.sun.proxy.$Proxy8Lombok supports: sun/apple javac 1.6, ECJ 原因&#xff1a;这是由于Lombok的版本过低的…

分布式:RocketMQ/Kafka总结(附下载链接)

文章目录 下载链接思维导图 本文总结的是关于消息队列的常见知识总结。消息队列和分布式系统息息相关&#xff0c;因此这里就将消息队列放到分布式中一并进行处理关联 下载链接 链接: https://pan.baidu.com/s/1hRTh7rSesikisgRUO2GBpA?pwdutgp 提取码: utgp 思维导图

刷题了:150. 逆波兰表达式求值 |239. 滑动窗口最大值 |347.前 K 个高频元素

150. 逆波兰表达式求值 题目链接:https://leetcode.cn/problems/evaluate-reverse-polish-notation/description/ 文章讲解:https://programmercarl.com/0150.%E9%80%86%E6%B3%A2%E5%85%B0%E8%A1%A8%E8%BE%BE%E5%BC%8F%E6%B1%82%E5%80%BC.html 视频讲解:https://www.bilibili.…

UE4调试UE4Editor-Cmd.exe

在工作中&#xff0c;我们看到这样的构建命令&#xff1a; %EnginePath%\Binaries\Win64\UE4Editor-Cmd.exe %ClientPath%\%ProjectName%.uproject -runHotPatcher {其它参数} 我们应该如何调试UE4Editor-Cmd.exe呢&#xff1f;其实调试 UE4Editor.exe 就可以了&#xff08;参考…

【优秀python系统毕设】基于Python flask的气象数据可视化系统设计与实现,有LSTM算法预测气温

第一章 绪论 1.1 研究背景 在当今信息爆炸的时代&#xff0c;气象数据作为重要的环境信息资源&#xff0c;扮演着关键的角色。然而&#xff0c;传统的气象数据呈现方式存在信息量庞大、难以理解的问题&#xff0c;限制了用户对气象信息的深入理解和利用。因此&#xff0c;基…

List容器

此处是带头双向链表 对于List&#xff0c;不像string、vector之类的&#xff0c;没有reserve的说法&#xff0c;也不支持[ ]和下标&#xff0c;只有一种方式遍历List也就是采用迭代器&#xff08;范围for的底层也是迭代器&#xff09;。 insert函数和erase函数(需要配合std库里…

文件包含漏洞及利用

一、文件包含功能 1、文件包含的作用&#xff1a;减小代码的荣誉 2、文件包含函数&#xff1a; include 、 require 3、文件包含的方式 静态文件包含------文件名是固定的------ a.php中存在普通的字符串&#xff0c;被b.php包含&#xff0c; a.php中的字符串会直接完成输出 a…

CSS:mix-blend-mode属性(设置元素的混合模式)

目录 一、mix-blend-mode属性介绍 二、mix-blend-mode常用属性值 三、mix-blend-mode属性应用 四、文字智能适配背景 1、原始样式 2、添加混合 3、实现代码 一、mix-blend-mode属性介绍 CSS中的【mix-blend-mode属性】描述了元素的内容应该与元素的直系父元素的内容和…

C# 植物大战僵尸

Winform 版本开发 高效率、流畅植物大战僵尸 git地址&#xff1a;冯腾飞/植物大战僵尸

3. 类的生命周期

类的生命周期是指一个类被加载&#xff0c;使用&#xff0c;卸载的一个过程&#xff0c;如下图&#xff1a; 类的加载阶段&#xff1a; 加载(Loading)阶段第一步是类加载器根据类的**全限定名&#xff08;也就是类路径&#xff09;**通过不同的渠道以二进制流的方式获取字节码…