提交表单数据

news/2024/7/19 13:48:12 标签: js

第一种

在form标签中添加Action(提交的地址)和method(post),且有一个submit按钮<input type=’submit’> 就可以进行数据的提交,每一个input标签都需要有一个name属性,才能进行提交

<form action=’http://www.123.com/postValue’ method=’post’>

<input type=’text’ name=’username’ />

<input type=’password’ name=’password’/>

<input type=’submit’ value=’登陆'/>

</form>

当点击登陆时,向服务端发生的数据是:username=username&password=password.

这种默认的提交方式,一般会进行页面的跳转(不成功时跳转到当前页面)。而有时候我们是对弹出框进行数据提交的,希望提交成功则关闭弹出框并刷选父页面,失败则提示失败原因,且弹出框不关闭。此时可以采用Ajax进行数据提交.

摘抄:https://www.cnblogs.com/Jxwz/p/4509618.html

第二种(常用)

onsubmit方法
onsubmit指定的方法返回true,则提交数据;返回false不提交数据。
οnsubmit=“return function” action中声明url

<form action="" methods="post" onsubmit="return check()">
 
  <input type="text" name="text" placeholder="请输入用户名"/>
  <input type="password" id="password"  name="password" placeholder="请输入密码"/>
  <input type="submit" value="提交"/>
</form>
 
 
<script>
 var re = /^[^\s]+$/;
 var pw = document.querySelector('#password')
  check(){
     if(re.test(pw.value)){
            return true;//不为空
 
        }else{
            return false;//为空
 
        }
 
  }
 
</script>

http://www.niftyadmin.cn/n/1371498.html

相关文章

for in,forEach,for of

for in 什么都可以遍历&#xff08;noodlist会显示原型上的属性&#xff09; for in多用于遍历对象&#xff0c;他会返回对象的属性名而for in不推荐遍历数组 为什么for in不推荐遍历数组 1.for in返回的是每个item的索引如果想对数组的每一项进行操作的话就会很复杂 2.for in…

迭代器,生成器

迭代器 for of不支持遍历普通对象&#xff0c;这里的普通对象指的是没有Symbol.iterator属性的对象。 当使用for of去遍历某一个数据结构的时候&#xff0c;首先去找Symbol.iterator&#xff0c;找到了就去遍历&#xff0c;没有找到的话不能遍历 对象的Symbol.iterator属性&am…

http知识点2

HTTP有哪些方法&#xff1f; HTTP1.0定义了三种请求方法&#xff1a; GET, POST 和 HEAD方法 HTTP1.1新增了五种请求方法&#xff1a;OPTIONS, PUT, DELETE, TRACE 和 CONNECT GET和POST有什么区别&#xff1f; 数据传输方式不同&#xff1a;GET请求通过URL传输数据&#xff0…

关于兼容问题

IE条件注释法 css 属性前缀法 选择器前缀法 图片来自&#xff1a;https://www.cnblogs.com/applejp/p/4180682.html

内存泄漏js

内存泄漏 就是不用的变量js无法进行垃圾回收 造成内存泄漏的原因 1.意外的全局变量&#xff08;全局变量指挂载在window上面的变量&#xff09; 全局变量的生命周期最长&#xff0c;直到页面关闭前&#xff0c;它都存活着&#xff0c;所以全局变量上的内存一直都不会被回收…

axios-retry可以让一个失败的网络请求再次自动发送n(自定义)次数

axios-retry可以让一个失败的网络请求再次自动发送n(自定义)次数 安装 npm install axios-retry引入 import axiosRetry from axios-retry;使用 axiosRetry(axios, { retries: 3 });图片来自&#xff1a;https://juejin.cn/post/7053471988752318472

nginx反向代理,vue2反向代理,vue3反向代理

正向代理和反向代理 反向代理&#xff08;Reverse Proxy&#xff09;对应的是正向代理&#xff08;Forward Proxy&#xff09;&#xff0c;他们的区别&#xff1a; 正向代理&#xff1a; 一般的访问流程是客户端直接向目标服务器发送请求并获取内容&#xff0c;使用正向代理后…

关于canvas和canvas案例

Canvas常见API 1.this.canvas.getContext(‘2d’) 初始化画布 // 获取canvas元素 this.canvas document.getElementById(tutorial) // 获取绘制二维上下文 this.ctx this.canvas.getContext(2d) 2.this.ctx.moveTo &#xff0c;this.ctx.lineTo(150, 50) moveTo 移动画笔到…