今天写一个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的区别的更多相关文章

  1. html中submit和button的区别(总结) [ 转自欣步同学 ]

    html中submit和button的区别(总结) submit是button的一个特例,也是button的一种,它把提交这个动作自动集成了. 如果表单在点击提交按钮后需要用JS进行处理(包括输入验证 ...

  2. HTML中submit和button的区别

    submit是button的一个特例,也是button的一种,它把提交这个动作自动集成了. 如果表单在点击提交按钮后需要用JS进行处理(包括输入验证)后再提交的话,通常都必须把submit改成butt ...

  3. html中submit和button的区别/ window.location.href 不跳转 的问题

    <input type="button">  <input type="submit"> 这两个的区别 是 button 不会自动提交表 ...

  4. html中 submit和button的区别?

    前者是向数据库提交表单 后者是单纯的按钮功能

  5. 网站开发进阶(四十四)input type="submit" 和"button"的区别

    网站开发进阶(四十四)input type="submit" 和"button"的区别   在一个页面上画一个按钮,有四种办法: 这就是一个按钮.如果你不写ja ...

  6. (网页)Angular.js 中 copy 赋值与 = 赋值 区别

    转自st.gg Angular.js 中 copy 赋值与 = 赋值 区别 为什么用 $scope.user = $scope.master; $scope.master 会跟着 $scope.use ...

  7. JS中isPrototypeOf 和hasOwnProperty 的区别 ------- js使用in和hasOwnProperty获取对象属性的区别

    JS中isPrototypeOf 和hasOwnProperty 的区别 1.isPrototypeOf isPrototypeOf是用来判断指定对象object1是否存在于另一个对象object2的 ...

  8. js中的substr和substring区别

    js中的substr和substring区别 Substring: 该方法可以有一个参数也可以有两个参数. (1)  一个参数: 示例: var str=“Olive”: str.substring( ...

  9. JS 中的require 和 import 区别整理

    ES6标准发布后,module成为标准,标准的使用是以export指令导出接口,以import引入模块,但是在我们一贯的node模块中,我们采用的是CommonJS规范,使用require引入模块,使 ...

随机推荐

  1. Java,Python,前端,Linux,公众号等5T编程资源整理免费下载

    场景 我的CSDN: https://blog.csdn.net/BADAO_LIUMANG_QIZHI 实现 马士兵Java学习视频 方立勋JavaWeb 尚硅谷Python核心基础 数据分析 机器 ...

  2. 前端之JavaScript篇

    一. 简介 javascript是一门动态弱类型的解释性编程语言, 增强页面动画效果,实现页面与用户之间实时动态的交互.  JavaScript有三部分组成: ECMAscript, DOM, BOM ...

  3. c语言的数据类型,运算符,存储类型

    [1词法符号]1. 关键字:32个1) 存储类型:决定(设备)变量的存储位置auto(自动型).extern(外部引用) static(静态型) register(寄存器类型)2) 数据类型:决定设备 ...

  4. Google、百度搜索引擎高级应用6/15

    不得不知道的搜索技巧.

  5. WordPress对接微信小程序遇到的问题

    1.文章内容中的“<”和“>”字符显示问题 小程序是使用“wxPares工具来实现html转wxml的,如果你的文本包含了代码比如xml会携带<>符号,程序会将其转化,造成解析 ...

  6. 2019年十大开源WEB应用防火墙点评

    2019年十大开源WEB应用防火墙点评 随着WEB应用的爆炸式成长和HTTPS加密的普及,针对网络应用层的攻击,像SQL注入.跨站脚本攻击.参数篡改.应用平台漏洞攻击.拒绝服务攻击等越来越多,传统的防 ...

  7. ubuntu13 eclipse菜单栏失效解决

    使用ubuntu13安装完eclipse和myeclipse后发现菜单栏单击时不显示下拉框只能通过快捷键显示. 百度了一下,找到以下解决办法. 打开终端运行下面的命令,打开eclipse后可正常显示菜 ...

  8. docker 运行容器时指定--sysctl参数来设置系统参数

    指定--sysctl参数来设置系统参数,通过这些参数来调整系统性能,Docker通过一个 ValidateSysctl函数来限制 sysctl参数可以传入的项,源码如下: // docker/opts ...

  9. mysql5.7初始密码及设置问题

    为了加强安全性,MySQL5.7为root用户随机生成了一个密码,如果安装的是RPM包,则默认是在/var/log/mysqld.log中. 可通过# grep "password" ...

  10. .Net Core 商城微服务项目系列(一):使用IdentityServer4构建基础登录验证

    这里第一次搭建,所以IdentityServer端比较简单,后期再进行完善. 1.新建API项目MI.Service.Identity,NuGet引用IdentityServer4,添加类InMemo ...