编程 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 相关文章推荐

使用jquery的ajax需要注意的地方dataType的设置

Aug 12 Javascript

jQuery中hasClass()方法用法实例

Jan 06 Javascript

JavaScript中setTimeout和setInterval函数的传参及调用

Mar 11 Javascript

全面解析Bootstrap中form、navbar的使用方法

May 30 Javascript

javascript正则表达式中分组详解

Jul 17 Javascript

webpack配置的最佳实践分享

Apr 21 Javascript

Angular.js项目中使用gulp实现自动化构建以及压缩打包详解

Jul 19 Javascript

微信小程序实现轮播图效果

Sep 07 Javascript

vue+axios新手实践实现登陆的示例代码

Jun 06 Javascript

浅析vue-router实现原理及两种模式

Feb 11 Javascript

JavaScript实现随机点名小程序

Oct 29 Javascript

VUE项目实现主题切换的多种方法

Nov 26 Vue.js

用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

PHP+Tidy－完美的XHTML纠错+过滤

2007/04/10 PHP

php下目前为目最全的CURL中文说明

2010/08/01 PHP

PHP中把对象转换为关联数组代码分享

2015/04/09 PHP

PHP如何通过传引用的思想实现无限分类(代码简单)

2015/10/13 PHP

php三种实现多线程类似的方法

2015/10/30 PHP

微信开发之php表单微信中自动提交两次问题解决办法

2017/01/08 PHP

PHP 结合 Boostrap 结合 js 实现学生列表删除编辑及搜索功能

2019/05/21 PHP

JS 实现Table相同行的单元格自动合并示例代码

2013/08/27 Javascript

详解JS 比较两个Json对象的值是否相等的实例

2013/11/20 Javascript

JS window对象的top、parent、opener含义介绍

2013/12/03 Javascript

jquery动态添加删除(tr/td)

2015/02/09 Javascript

json对象转为字符串,当做参数传递时加密解密的实现方法

2016/06/29 Javascript

jQuery实现的导航下拉菜单效果

2016/07/04 Javascript

javascript 数组的正态分布排序的问题

2016/07/31 Javascript

BootStrap Validator使用注意事项(必看篇)

2016/09/28 Javascript

js编写的treeview使用方法

2016/11/11 Javascript

angular实现form验证实例代码

2017/01/17 Javascript

JavaScript通过filereader接口读取文件

2017/05/10 Javascript

javaScript中封装的各种写法示例（推荐）

2017/07/03 Javascript

js实现移动端导航点击自动滑动效果

2017/07/18 Javascript

import与export在node.js中的使用详解

2017/09/28 Javascript

JS中原始值和引用值的储存方式示例详解

2018/03/23 Javascript

vue.js中npm安装教程图解

2018/04/10 Javascript

Vue脚手架的简单使用实例

2018/07/10 Javascript

javascript匿名函数中的'return function()'作用

2018/10/15 Javascript

js String.prototype.trim字符去前后空格的扩展

2020/08/23 Javascript

JavaScript设计模式之观察者模式与发布订阅模式详解

2020/05/07 Javascript

[52:03]Secret vs VG 2018国际邀请赛小组赛BO2 第一场 8.17

2018/08/20 DOTA

Numpy中转置transpose、T和swapaxes的实例讲解

2018/04/17 Python

Python实现iOS自动化打包详解步骤

2018/10/03 Python

python3中确保枚举值代码分析

2020/12/02 Python

jupyter notebook远程访问不了的问题解决方法

2021/01/11 Python

时尚孕妇装：HATCH Collection

2019/09/24 全球购物

团日活动总结书

2014/05/08 职场文书

升学宴演讲稿

2014/09/01 职场文书

python基础之模块的导入

2021/10/24 Python