编程 Javascript

实现checkbox全选、反选、取消JavaScript小脚本异常

Posted in Javascript onApril 10, 2014

今天在实现checkbox全选，反选，取消JavaScript小脚本的时候，总是出现点击后页面瞬间刷新，选择的checkbox全部取消的问题，debug了半天，才发现原来是<button>标签中少写了一个type属性的原因，郁闷啊，希望自己以后少犯这种特别2的错误，特此记录。

<!-- 以下为错误写法 --> 
<button name="checkAll" value="全选" class="checkButton" onClick="checkAll(form_favor,status)">全选</button>

<!-- 正确写法 --> 
<button name="checkAll" type="button" value="全选" class="checkButton" onClick="checkAll(form_favor,status)">全选</button>

看了w3c的描述，瞬间明白了，在没写type属性的情况下，当时浏览器默认将它当submit处理了，而我表单接受处理的脚本还是空着的，所以就产生了“刷新”的现象！

实现checkbox全选、反选、取消JavaScript小脚本异常

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

限制文本字节数js代码

Mar 06 Javascript

用javascript获取当页面上鼠标光标位置和触发事件的对象的代码

Dec 09 Javascript

contains和compareDocumentPosition 方法来确定是否HTML节点间的关系

Sep 13 Javascript

如何学习Javascript入门指导

Nov 01 Javascript

用js+iframe形成页面的一种遮罩效果的具体实现

Dec 31 Javascript

js动态切换图片的方法

Jan 20 Javascript

悬浮广告方法日常收集整理

Mar 18 Javascript

微信小程序开发之map地图实现教程

Jun 08 Javascript

vue中设置height:100%无效的问题及解决方法

Jul 27 Javascript

layer.open 按钮的点击事件关闭方法

Aug 17 Javascript

小程序实现左右来回滚动字幕效果

Dec 28 Javascript

js实现的在本地预览图片功能示例

Nov 09 Javascript

用js设置下拉框为只读的小技巧

Apr 10 #Javascript

js获取上传文件大小示例代码

Apr 10 #Javascript

JavaScript中双叹号(!!)作用示例介绍

Apr 10 #Javascript

js实现图片旋转的三种方法

Apr 10 #Javascript

javascript:void(0)的问题使用探讨

Apr 10 #Javascript

ajax请求乱码的解决方法(中文乱码)

Apr 10 #Javascript

php的文件上传入门教程（实例讲解）

Apr 10 #Javascript

You might like

php4的session功能评述（二）

2006/10/09 PHP

Uchome1.2 1.5 代码学习 common.php

2009/04/24 PHP

php检查是否是ajax请求的方法

2015/04/16 PHP

Laravel学习教程之本地化模块

2017/08/18 PHP

PHP根据树的前序遍历和中序遍历构造树并输出后序遍历的方法

2017/11/10 PHP

php中目录操作opendir()、readdir()及scandir()用法示例

2019/06/08 PHP

jQuery 1.0.2

2006/10/11 Javascript

找到了一篇jQuery与Prototype并存的冲突的解决方法

2007/08/29 Javascript

Javascript 阻止javascript事件冒泡，获取控件ID值

2009/06/27 Javascript

JavaScript 动态创建VML的方法

2009/10/14 Javascript

Javascript 页面模板化很多人没有使用过的方法

2012/06/05 Javascript

从数据库读取数据后将其输出成html标签的三种方法

2014/10/13 Javascript

JavaScript将字符串转换成字符编码列表的方法

2015/03/19 Javascript

javascript bom是什么及bom和dom的区别

2015/11/26 Javascript

jQuery自定义滚动条完整实例

2016/01/08 Javascript

在Docker快速部署Node.js应用的详细步骤

2016/09/02 Javascript

iOS和Android用同一个二维码实现跳转下载链接的方法

2016/09/28 Javascript

浅谈Angular中ngModel的$render

2016/10/24 Javascript

JS实现探测网站链接的方法【测试可用】

2016/11/08 Javascript

Bootstrap的modal拖动效果

2016/12/25 Javascript

BootStrap Datepicker 插件修改为默认中文的实现方法

2017/02/10 Javascript

ES6入门教程之let和const命令详解

2017/05/17 Javascript

vue.js组件之间传递数据的方法

2017/07/10 Javascript

Angular限制input框输入金额（是小数的话只保留两位小数点）

2017/07/13 Javascript

微信小程序如何获取openid及用户信息

2018/01/26 Javascript

微信小程序之滑动页面隐藏和显示组件功能的实现代码

2020/06/19 Javascript

python实现异步回调机制代码分享

2014/01/10 Python

python实现的AES双向对称加密解密与用法分析

2017/05/02 Python

Python理解递归的方法总结

2019/01/28 Python

Europcar澳大利亚官网：全球汽车租赁领域的领导者

2019/03/24 全球购物

碧欧泉Biotherm加拿大官方网站：法国高端护肤品牌

2019/10/18 全球购物

毕业生求职推荐信

2013/11/04 职场文书

yy生日主持词

2014/03/20 职场文书

2015年社区统计工作总结

2015/04/21 职场文书

学校百日安全活动总结

2015/05/07 职场文书

学生党支部工作总结2015

2015/05/26 职场文书