当前位置: 首页 > news >正文

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前端&#xff0c;登录&#xff0c;post请求提交 json带参 3ca9855b3fd279fa17d46f01dc652030.jpg <!DOCTYPE html> <html><head><meta http-equiv"Content-Type" content"text/html; charsetutf-8" /><title></t…...

防火墙实验

防火墙 ping&#xff08;网络测试工具&#xff0c;测试主机之间的可达性&#xff09;原理&#xff1a; 发送一些小的网络数据包&#xff08;ICMP数据包&#xff09;到目标主机&#xff0c;并等待目标主机返回一个响应&#xff08;通常是回显应答 Echo Reply&#xff09;。 ss…...

php中进程、线程、协程详细讲解

目录 一、什么是进程、线程、协程 1、什么是进程&#xff08;Process&#xff09;&#xff1a; 2 、什么是线程&#xff08;Thread&#xff09;&#xff1a; 3、什么是协程&#xff08;Coroutine&#xff09;&#xff1a; 二、 进程、线程、协程的关系 1、进程与线程关系 …...

无线通信中SINR的含义

在无线通信中&#xff0c;SINR代表"Signal-to-Interference-plus-Noise Ratio"&#xff0c;即信号与干扰加噪声比。这是一个重要的性能度量&#xff0c;用于评估和描述接收信号的质量&#xff0c;以及在无线通信系统中的通信性能。 SINR考虑了以下三个关键因素&…...

pnp单目相机标定测距

参考&#xff1a;opencv 单目相机pnp测距&#xff08;Cpp&#xff09;-CSDN博客...

Java反射获取内部类方法

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

发挥服务器的无限潜能:创意项目、在线社区和更多

✅作者简介&#xff1a;2022年博客新星 第八。热爱国学的Java后端开发者&#xff0c;修心和技术同步精进。 &#x1f34e;个人主页&#xff1a;Java Fans的博客 &#x1f34a;个人信条&#xff1a;不迁怒&#xff0c;不贰过。小知识&#xff0c;大智慧。 ✨特色专栏&#xff1a…...

华为OD 绘图机器(100分)【java】A卷+B卷

华为OD统一考试A卷+B卷 新题库说明 你收到的链接上面会标注A卷还是B卷。目前大部分收到的都是B卷。 B卷对应20022部分考题以及新出的题目,A卷对应的是新出的题目。 我将持续更新最新题目 获取更多免费题目可前往夸克网盘下载,请点击以下链接进入: 我用夸克网盘分享了「华为O…...

文件上传接口

以下是一个简单的Java文件上传接口的示例代码&#xff1a; import org.springframework.http.HttpStatus;import org.springframework.http.ResponseEntity;import org.springframework.web.bind.annotation.PostMapping;import org.springframework.web.bind.annotation.Requ…...

基于矢量控制策略的异步电机调速系统设计

摘 要 由于国内人民生活水平的提高&#xff0c;科技不断地进步&#xff0c;控制不断地完善&#xff0c;从而促使矢量控制技术在电气传动系统领域占据主导权&#xff0c;也使得交流异步电机调速控制系统被广泛应用。在交流异步电机调速系统设计领域中&#xff0c;矢量控制成为目…...

Ubuntu下载工具ip addr、ifconfig、ping、make

Ubuntu下载工具ip addr、ifconfig、ping、make ping 在 Ubuntu 上获取网络工具包通常是通过安装相关软件包的方式来完成的。Ubuntu 默认包含一些常见的网络工具&#xff0c;但如果你需要安装其他工具&#xff0c;你可以使用 apt 命令或者 snap 命令进行安装。以下是一些常见的…...

【数据结构】常见复杂度习题详解 ------ 习题篇

文章目录 &#x1f4cb;前言一. ⛳️前篇回顾二. ⛳️常见时间复杂度计算举例1️⃣实例一2️⃣实例二3️⃣实例三4️⃣实例四5️⃣实例五6️⃣实例六7️⃣实例七8️⃣实例八 三. ⛳️常见空间复杂度计算举例1️⃣实例一2️⃣实例二3️⃣实例三 四. ⛳️总结 &#x1f4cb;前言 …...

一、vue介绍

一、介绍 vue式前端框架&#xff0c;是一套用于构建用户界面的渐进式框架 1、安装vue 安装node.js&#xff08;配置环境变量&#xff09; 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内核启动》部分讲解&#xff0c;我们知道了在进入start_kernel之前&#xff0c;通过指令adr_l x8, vectors&#xff1b;msr vbar_el1, x8设置了异常向量表&#xff0c;那么异常向量表的结构是怎么样…...

C++基类和派生类的内存分配,多态的实现

目录 基类和派生类的内存分配基类和派生类的成员归属多态的实现 基类和派生类的内存分配 类包括成员变量&#xff08;data member&#xff09;和成员函数&#xff08;member function&#xff09;。 成员变量分为静态数据&#xff08;static data&#xff09;和非静态数据&…...

C/C++基础

C 二进制 问题&#xff1a;二进制怎么表示整数、小数、正数、负数&#xff0c;如何存储&#xff1f;加减乘除怎么运算&#xff08;见文章《计算机加减乘除本质》&#xff09;&#xff1f; 变量 c定义一个变量的时候&#xff0c;需要事先定义变量大小和变量类型。 //有符号…...

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、动态内存管理过程中&#xff0c;一些常见的错误3.1、对NULL指针的解引用操作3.2、对动态内存开辟的空间的越界访问3.3、对非动…...

Nougat来了,能否成为pdf格式转换的新神器?

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

C++文件和流

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

OpenXR Toolkit完全指南:3步让你的VR游戏性能提升50%

OpenXR Toolkit完全指南&#xff1a;3步让你的VR游戏性能提升50% 【免费下载链接】OpenXR-Toolkit A collection of useful features to customize and improve existing OpenXR applications. 项目地址: https://gitcode.com/gh_mirrors/op/OpenXR-Toolkit 想要在不升级…...

5分钟快速上手:Awoo Installer - 你的Switch游戏安装神器

5分钟快速上手&#xff1a;Awoo Installer - 你的Switch游戏安装神器 【免费下载链接】Awoo-Installer A No-Bullshit NSP, NSZ, XCI, and XCZ Installer for Nintendo Switch 项目地址: https://gitcode.com/gh_mirrors/aw/Awoo-Installer 还在为Switch游戏安装而烦恼吗…...

Ostrakon-VL-8B与ComfyUI工作流结合:可视化视觉分析流程搭建

Ostrakon-VL-8B与ComfyUI工作流结合&#xff1a;可视化视觉分析流程搭建 1. 引言&#xff1a;当视觉大模型遇上可视化编程 如果你玩过AI绘画&#xff0c;大概率听说过ComfyUI。这个工具把复杂的AI图像生成过程&#xff0c;变成了一个个可以拖拽、连接的“积木块”&#xff0c…...

告别纯CPU硬扛!手把手教你用树莓派5的VideoCore VII GPU加速NCNN+YOLOv8推理

解锁树莓派5的VideoCore VII潜能&#xff1a;NCNNYOLOv8 GPU加速实战指南 树莓派5的发布带来了令人振奋的性能提升&#xff0c;尤其是其VideoCore VII GPU的图形处理能力。对于计算机视觉开发者而言&#xff0c;这意味着我们终于可以在边缘设备上实现更高效的模型推理。本文将带…...

一台电脑畅玩多人游戏:Nucleus Co-Op分屏神器完全指南

一台电脑畅玩多人游戏&#xff1a;Nucleus Co-Op分屏神器完全指南 【免费下载链接】nucleuscoop Starts multiple instances of a game for split-screen multiplayer gaming! 项目地址: https://gitcode.com/gh_mirrors/nu/nucleuscoop 还在为和朋友一起玩游戏需要多台…...

企业SEO优化如何与移动端优化协同发展_企业SEO优化的结果如何持续维护和改进

企业SEO优化如何与移动端优化协同发展 在当前数字化时代&#xff0c;企业SEO优化和移动端优化是两大关键领域&#xff0c;它们共同作用于企业的在线表现和用户体验。如何让这两者协同发展&#xff0c;已经成为企业数字营销策略中不可或缺的一部分。 企业SEO优化与移动端优化的…...

ERNIE-4.5-0.3B-PT企业落地场景:基于vLLM的轻量级智能问答助手搭建

ERNIE-4.5-0.3B-PT企业落地场景&#xff1a;基于vLLM的轻量级智能问答助手搭建 1. 项目概述与价值 智能问答助手已经成为企业提升服务效率和用户体验的重要工具。传统方案往往面临部署复杂、资源消耗大、响应速度慢等问题。今天介绍的基于vLLM部署的ERNIE-4.5-0.3B-PT模型&am…...

Phi-3-vision-128k-instruct Ollama国内镜像源加速部署与多模型管理

Phi-3-vision-128k-instruct Ollama国内镜像源加速部署与多模型管理 1. 为什么需要国内镜像源 如果你在国内尝试使用Ollama拉取Phi-3-vision这样的大型模型&#xff0c;可能会遇到下载速度慢甚至失败的问题。这是因为默认的模型仓库位于海外服务器&#xff0c;网络连接不稳定…...

零信任实践:OpenClaw+SecGPT-14B构建个人安全决策引擎

零信任实践&#xff1a;OpenClawSecGPT-14B构建个人安全决策引擎 1. 为什么需要个人安全决策引擎 去年某个深夜&#xff0c;我的服务器突然收到大量异常登录尝试。虽然最终没有造成损失&#xff0c;但这件事让我意识到&#xff1a;传统的静态密码和固定权限规则&#xff0c;在…...

注意力机制解析:PETRv2-BEV时空特征融合的可视化研究

注意力机制解析&#xff1a;PETRv2-BEV时空特征融合的可视化研究 1. 当我们说“注意力”时&#xff0c;到底在关注什么 很多人第一次听到“注意力机制”这个词&#xff0c;会下意识联想到人眼聚焦某个物体的动作。这种直觉其实很准确——在PETRv2-BEV这类模型里&#xff0c;“…...