js中submit和button的区别
今天写一个js验证 遇到点小坑 记录一下
button-普通按钮,submit-提交按钮。
submit是button的一个特例,也是button的一种,它把提交这个动作自动集成了,submit和button,二者都以按钮的形式展现,看起来都是按钮,所不同的是type属性和处发响应的事件上。
function check(){ var name = document.getElementById("name").value; if(name == null || name == ''){ alert("用户名不能为空"); return false; } return true; } <form name="form" action="跳转的页面" method="post" onsubmit="return check()"> <input type="text" id="name"/> <input type="submit" value="提交"/> </form>
上面的场景中,表单在点击提交按钮后需要用JS进行处理(包括输入验证)后再提交的话,通常我们提倡用button,
如果需要使用submit提交前验证的话 应在方法前加return。onClick方法不加return 会自动提交,并不会起到约束的作用, 所以,使用submit时需要验证请加 return true或false。
如一个登陆模块,先验证用户名是否为空,如果为空,SUBMIT点击时永远提交不到from表单指定页面。只能是表单形式发送 而且不能再表单指定的页面中去验证传进来的值。
js中submit和button的区别的更多相关文章
- html中submit和button的区别(总结) [ 转自欣步同学 ]
html中submit和button的区别(总结) submit是button的一个特例,也是button的一种,它把提交这个动作自动集成了. 如果表单在点击提交按钮后需要用JS进行处理(包括输入验证 ...
- HTML中submit和button的区别
submit是button的一个特例,也是button的一种,它把提交这个动作自动集成了. 如果表单在点击提交按钮后需要用JS进行处理(包括输入验证)后再提交的话,通常都必须把submit改成butt ...
- html中submit和button的区别/ window.location.href 不跳转 的问题
<input type="button"> <input type="submit"> 这两个的区别 是 button 不会自动提交表 ...
- html中 submit和button的区别?
前者是向数据库提交表单 后者是单纯的按钮功能
- 网站开发进阶(四十四)input type="submit" 和"button"的区别
网站开发进阶(四十四)input type="submit" 和"button"的区别 在一个页面上画一个按钮,有四种办法: 这就是一个按钮.如果你不写ja ...
- (网页)Angular.js 中 copy 赋值与 = 赋值 区别
转自st.gg Angular.js 中 copy 赋值与 = 赋值 区别 为什么用 $scope.user = $scope.master; $scope.master 会跟着 $scope.use ...
- JS中isPrototypeOf 和hasOwnProperty 的区别 ------- js使用in和hasOwnProperty获取对象属性的区别
JS中isPrototypeOf 和hasOwnProperty 的区别 1.isPrototypeOf isPrototypeOf是用来判断指定对象object1是否存在于另一个对象object2的 ...
- js中的substr和substring区别
js中的substr和substring区别 Substring: 该方法可以有一个参数也可以有两个参数. (1) 一个参数: 示例: var str=“Olive”: str.substring( ...
- JS 中的require 和 import 区别整理
ES6标准发布后,module成为标准,标准的使用是以export指令导出接口,以import引入模块,但是在我们一贯的node模块中,我们采用的是CommonJS规范,使用require引入模块,使 ...
随机推荐
- python SSTI利用
原理python的SSTI不仅可以向网页插入一些XSS代码,而且还可以获取一些变量和函数信息,尤其是secret_key,如果获取到则可以对flask框架的session可以进行伪造.对于tornad ...
- 浮动后的 <li> 如何在 <ul> 中居中显示?
百度了许久都没有满意的解决方案,现在终于搞定了. 其实,只要 ul 的父元素 css 样式设了 text-align: center; 然后 ul 设了 display: inline-block; ...
- 工业控制或办公局域网中的192.168.X.X网段
IPv4地址分为A.B.C.D.E五类,除去特殊作用的D.E两类,剩下的A.B.C三类地址是我们常见的IP地址段.A类地址的容量最大,可以容纳16777214个主机,B类地址可以容纳65534个主机, ...
- Fliptile(枚举+DFS)
Problem Description Farmer John knows that an intellectually satisfied cow is a happy cow who will g ...
- .netCore+Vue 搭建的简捷开发框架 (2)--仓储层实现和EFCore 的使用
书接上文,继续搭建我们基于.netCore 的开发框架.首先是我们的项目分层结构. 这个分层结构,是参考张老师的分层结构,但是实际项目中,我没有去实现仓储模型.因为我使用的是EFCore ,最近也一直 ...
- Mongodb关于查询返回指定字段的方法记录
//通常指定字段由前端传入后台,例如params 前端以逗号分隔 //后端获取字段后操作如下: Query query = new Query(); if (params != null) { Str ...
- windows下安装vue教程
前言:前段时间学习了下vue,也算是能简单开发了,今天就记录下怎么通过vue-cli来安装vue. 因vue是基于node环境的,如果你还不会安装的话,可以看下我的这个教程:安装node.js和npm ...
- [Boost库] noncopyable——禁止拷贝的类
1.noncopyable允许程序轻松地实现一个禁止拷贝的类,在头文件<boost/noncopyable.hpp>中 2.实现原理很简单:noncopyable的实现就是用了C++中 ...
- 浅谈@RestController和@Controller的区别
在做Spring MVC开发时,如果对@RestController或者@Controller这两个注解理解不够清晰的话,就难免会出现用混的情况.而混用的结果往往是无法实现期望的跳转结果或者是直接将跳 ...
- JVM 内存区域大小参数设置
JVM内存包括区域 Heap(堆区) New Generation(新生代) Eden 伊甸园 Survivor From Survivor To Old Generation(老年代) 方法区 Pe ...