html web前端,登录,post请求提交 json带参
html web前端,登录,post请求提交 json带参
3ca9855b3fd279fa17d46f01dc652030.jpg
<!DOCTYPE html>
<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title></title></head><body><div><div style="display: flex; flex-direction: column; margin: 15px;"><input id="phone" type="text" autocomplete="off" placeholder="请输入手机号" /><input id="code" type="text" autocomplete="off" placeholder="请输入验证码/密码" /></div><div style="margin: 15px;"><button onClick="login()">登录</button></div></div></body><script type="text/javascript">var phoneDom = document.querySelector('#phone'); // 获取输入框内容,手机号码var codeDom = document.querySelector('#code'); // 获取输入框内容,验证码/或密码/*** 提交信息* POST发送请求*/function login() {///// // 判断手机号码是否正确// var phoneReg = /(^1[3|4|5|7|8]\d{9}$)|(^09\d{8}$)/; // 手机号正则// var phone = (phoneDom.value).trim();// if (!phoneReg.test(phone)) {// alert(" 请输入有效的手机号码"); // 判断手机号码是否正确// return false;// }///// // 判断验证码/或密码是否6位数// var code = codeDom.value;// if (!code || code.trim().length != 6) {// alert("请输入6位短信验证码"); // 判断验证码/或密码是否6位数// return false;// }// 发送 JSON 数据var data = {phone: phoneDom.value, // 手机号码verificationCode: codeDom.value, // 验证码/或密码};// 创建一个 XMLHttpRequest 对象var xhr = new XMLHttpRequest();// 配置请求xhr.open('POST', 'https://api.wzyanche.com/cusInfo/login', true);xhr.setRequestHeader('Content-Type', 'application/json');//发送xhr.send(JSON.stringify(data));// 监听请求的状态,处理返回值xhr.onreadystatechange = function() {if (xhr.readyState === 4) {if (xhr.status == '200') {//手动对数据转化console.log('222 000 返回的数据', xhr.response);let data1 = xhr.response;console.log('222 111 返回的数据', data1);// 打印,获取json里的对象var data2 = JSON.parse(xhr.responseText)console.log('222 222 返回的数据', data2.retMsg);}}}}</script></html>
相关文章:

html web前端,登录,post请求提交 json带参
html web前端,登录,post请求提交 json带参 3ca9855b3fd279fa17d46f01dc652030.jpg <!DOCTYPE html> <html><head><meta http-equiv"Content-Type" content"text/html; charsetutf-8" /><title></t…...
防火墙实验
防火墙 ping(网络测试工具,测试主机之间的可达性)原理: 发送一些小的网络数据包(ICMP数据包)到目标主机,并等待目标主机返回一个响应(通常是回显应答 Echo Reply)。 ss…...
php中进程、线程、协程详细讲解
目录 一、什么是进程、线程、协程 1、什么是进程(Process): 2 、什么是线程(Thread): 3、什么是协程(Coroutine): 二、 进程、线程、协程的关系 1、进程与线程关系 …...
无线通信中SINR的含义
在无线通信中,SINR代表"Signal-to-Interference-plus-Noise Ratio",即信号与干扰加噪声比。这是一个重要的性能度量,用于评估和描述接收信号的质量,以及在无线通信系统中的通信性能。 SINR考虑了以下三个关键因素&…...
pnp单目相机标定测距
参考:opencv 单目相机pnp测距(Cpp)-CSDN博客...

Java反射获取内部类方法
Java反射获取内部类方法 结论一、案例准备二、测试方法:使用反射获取类的成员内部类和方法具体操作具体操作(使用getDeclaredClasses) 结论 Java 通过反射可以获得内部类,包括内部类属性信息和方法。 一、案例准备 创建了一个类…...

发挥服务器的无限潜能:创意项目、在线社区和更多
✅作者简介:2022年博客新星 第八。热爱国学的Java后端开发者,修心和技术同步精进。 🍎个人主页:Java Fans的博客 🍊个人信条:不迁怒,不贰过。小知识,大智慧。 ✨特色专栏:…...
华为OD 绘图机器(100分)【java】A卷+B卷
华为OD统一考试A卷+B卷 新题库说明 你收到的链接上面会标注A卷还是B卷。目前大部分收到的都是B卷。 B卷对应20022部分考题以及新出的题目,A卷对应的是新出的题目。 我将持续更新最新题目 获取更多免费题目可前往夸克网盘下载,请点击以下链接进入: 我用夸克网盘分享了「华为O…...
文件上传接口
以下是一个简单的Java文件上传接口的示例代码: import org.springframework.http.HttpStatus;import org.springframework.http.ResponseEntity;import org.springframework.web.bind.annotation.PostMapping;import org.springframework.web.bind.annotation.Requ…...
基于矢量控制策略的异步电机调速系统设计
摘 要 由于国内人民生活水平的提高,科技不断地进步,控制不断地完善,从而促使矢量控制技术在电气传动系统领域占据主导权,也使得交流异步电机调速控制系统被广泛应用。在交流异步电机调速系统设计领域中,矢量控制成为目…...
Ubuntu下载工具ip addr、ifconfig、ping、make
Ubuntu下载工具ip addr、ifconfig、ping、make ping 在 Ubuntu 上获取网络工具包通常是通过安装相关软件包的方式来完成的。Ubuntu 默认包含一些常见的网络工具,但如果你需要安装其他工具,你可以使用 apt 命令或者 snap 命令进行安装。以下是一些常见的…...

【数据结构】常见复杂度习题详解 ------ 习题篇
文章目录 📋前言一. ⛳️前篇回顾二. ⛳️常见时间复杂度计算举例1️⃣实例一2️⃣实例二3️⃣实例三4️⃣实例四5️⃣实例五6️⃣实例六7️⃣实例七8️⃣实例八 三. ⛳️常见空间复杂度计算举例1️⃣实例一2️⃣实例二3️⃣实例三 四. ⛳️总结 📋前言 …...
一、vue介绍
一、介绍 vue式前端框架,是一套用于构建用户界面的渐进式框架 1、安装vue 安装node.js(配置环境变量) https://nodejs.org/en/download/ 更换镜像 npm config set registry https://registry.npm.taobao.org 查看镜像 npm config get regi…...
Linux ARMv8 异常向量表
http://blog.chinaunix.net/uid-69947851-id-5830546.html 本章接着《Linux内核启动》部分讲解,我们知道了在进入start_kernel之前,通过指令adr_l x8, vectors;msr vbar_el1, x8设置了异常向量表,那么异常向量表的结构是怎么样…...

C++基类和派生类的内存分配,多态的实现
目录 基类和派生类的内存分配基类和派生类的成员归属多态的实现 基类和派生类的内存分配 类包括成员变量(data member)和成员函数(member function)。 成员变量分为静态数据(static data)和非静态数据&…...
C/C++基础
C 二进制 问题:二进制怎么表示整数、小数、正数、负数,如何存储?加减乘除怎么运算(见文章《计算机加减乘除本质》)? 变量 c定义一个变量的时候,需要事先定义变量大小和变量类型。 //有符号…...

MySQL基础练习题
数据表介绍 --1.学生表 Student(SId,Sname,Sage,Ssex) --SId 学生编号,Sname 学生姓名,Sage 出生年月,Ssex 学生性别 --2.课程表 Course(CId,Cname,TId) --CId 课程编号,Cname 课程名称,TId 教师编号 --3.教师表 Teacher(TId,Tname) --TId 教师编号,Tname 教师姓名 --4.成绩…...
【C语言学习笔记 --- 动态内存管理】
C语言程序设计笔记---029 C语言之动态内存管理1、介绍动态内存管理2、动态内存函数的介绍2.1、malloc和free函数2.2、calloc函数2.3、realloc函数 3、动态内存管理过程中,一些常见的错误3.1、对NULL指针的解引用操作3.2、对动态内存开辟的空间的越界访问3.3、对非动…...

Nougat来了,能否成为pdf格式转换的新神器?
Nougat来了,能否成为pdf格式转换的新神器? 论文链接:https://arxiv.org/pdf/2308.13418v1.pdf 项目地址:https://github.com/facebookresearch/nougat What happened?🤨 科学知识主要存储在书籍和科学期…...

C++文件和流
到目前为止,我们已经使用了 iostream 标准库,它提供了 cin 和 cout 方法分别用于从标准输入读取流和向标准输出写入流。 本教程介绍如何从文件读取流和向文件写入流。这就需要用到 C 中另一个标准库 fstream,它定义了三个新的数据类型&#x…...

Linux应用开发之网络套接字编程(实例篇)
服务端与客户端单连接 服务端代码 #include <sys/socket.h> #include <sys/types.h> #include <netinet/in.h> #include <stdio.h> #include <stdlib.h> #include <string.h> #include <arpa/inet.h> #include <pthread.h> …...
vscode里如何用git
打开vs终端执行如下: 1 初始化 Git 仓库(如果尚未初始化) git init 2 添加文件到 Git 仓库 git add . 3 使用 git commit 命令来提交你的更改。确保在提交时加上一个有用的消息。 git commit -m "备注信息" 4 …...

css实现圆环展示百分比,根据值动态展示所占比例
代码如下 <view class""><view class"circle-chart"><view v-if"!!num" class"pie-item" :style"{background: conic-gradient(var(--one-color) 0%,#E9E6F1 ${num}%),}"></view><view v-else …...
脑机新手指南(八):OpenBCI_GUI:从环境搭建到数据可视化(下)
一、数据处理与分析实战 (一)实时滤波与参数调整 基础滤波操作 60Hz 工频滤波:勾选界面右侧 “60Hz” 复选框,可有效抑制电网干扰(适用于北美地区,欧洲用户可调整为 50Hz)。 平滑处理&…...

Vue2 第一节_Vue2上手_插值表达式{{}}_访问数据和修改数据_Vue开发者工具
文章目录 1.Vue2上手-如何创建一个Vue实例,进行初始化渲染2. 插值表达式{{}}3. 访问数据和修改数据4. vue响应式5. Vue开发者工具--方便调试 1.Vue2上手-如何创建一个Vue实例,进行初始化渲染 准备容器引包创建Vue实例 new Vue()指定配置项 ->渲染数据 准备一个容器,例如: …...
镜像里切换为普通用户
如果你登录远程虚拟机默认就是 root 用户,但你不希望用 root 权限运行 ns-3(这是对的,ns3 工具会拒绝 root),你可以按以下方法创建一个 非 root 用户账号 并切换到它运行 ns-3。 一次性解决方案:创建非 roo…...

04-初识css
一、css样式引入 1.1.内部样式 <div style"width: 100px;"></div>1.2.外部样式 1.2.1.外部样式1 <style>.aa {width: 100px;} </style> <div class"aa"></div>1.2.2.外部样式2 <!-- rel内表面引入的是style样…...

OPENCV形态学基础之二腐蚀
一.腐蚀的原理 (图1) 数学表达式:dst(x,y) erode(src(x,y)) min(x,y)src(xx,yy) 腐蚀也是图像形态学的基本功能之一,腐蚀跟膨胀属于反向操作,膨胀是把图像图像变大,而腐蚀就是把图像变小。腐蚀后的图像变小变暗淡。 腐蚀…...
Webpack性能优化:构建速度与体积优化策略
一、构建速度优化 1、升级Webpack和Node.js 优化效果:Webpack 4比Webpack 3构建时间降低60%-98%。原因: V8引擎优化(for of替代forEach、Map/Set替代Object)。默认使用更快的md4哈希算法。AST直接从Loa…...

Unity UGUI Button事件流程
场景结构 测试代码 public class TestBtn : MonoBehaviour {void Start(){var btn GetComponent<Button>();btn.onClick.AddListener(OnClick);}private void OnClick(){Debug.Log("666");}}当添加事件时 // 实例化一个ButtonClickedEvent的事件 [Formerl…...