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

对YUI扩展的Gird组件 Part-2

Mar 10 Javascript

JQUERY设置IFRAME的SRC值的代码

Nov 30 Javascript

用Jquery实现滚动新闻

Feb 12 Javascript

JS获取网页属性包括宽、高等等

Apr 03 Javascript

通过$(this)使用jQuery包装后的方法或属性

May 18 Javascript

js实现数字每三位加逗号的方法

Feb 05 Javascript

jQuery实现带有洗牌效果的动画分页实例

Aug 31 Javascript

基于Bootstrap仿淘宝分页控件实现代码

Nov 07 Javascript

原生js实现查询天气小应用

Dec 09 Javascript

微信小程序表单验证form提交错误提示效果

Jun 19 Javascript

微信小程序—setTimeOut定时器的问题及解决

Jul 26 Javascript

Vue 构造选项 - 进阶使用说明

Aug 14 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

浅析HTTP消息头网页缓存控制以及header常用指令介绍

2013/06/28 PHP

跟我学Laravel之配置Laravel

2014/10/15 PHP

PHP通过插入mysql数据来实现多机互锁实例

2014/11/05 PHP

php 在字符串指定位置插入新字符的简单实现

2016/06/28 PHP

jQuery 页面 Mask实现代码

2010/01/09 Javascript

JS获取节点的兄弟,父级,子级元素的方法

2014/01/09 Javascript

JavaScript匿名函数用法分析

2015/02/13 Javascript

JS实现在线统计一个页面内鼠标点击次数的方法

2015/02/28 Javascript

在Ubuntu系统上安装Node.JS的教程

2015/10/15 Javascript

JavaScript每天必学之基础知识

2016/09/17 Javascript

js 实现一些跨浏览器的事件方法详解及实例

2016/10/27 Javascript

JS图片压缩（pc端和移动端都适用）

2017/01/12 Javascript

浅谈$_FILES数组为空的原因

2017/02/16 Javascript

Node.js学习之TCP/IP数据通讯(实例讲解)

2017/10/11 Javascript

详解React Native 采用Fetch方式发送跨域POST请求

2017/11/15 Javascript

arcgis for js栅格图层叠加(Raster Layer)问题

2017/11/22 Javascript

JavaScript数组基于交换的排序示例【冒泡排序】

2018/07/21 Javascript

使用electron将vue-cli项目打包成exe的方法

2018/09/29 Javascript

[32:07]完美世界DOTA2联赛PWL S3 LBZS vs Rebirth 第一场 12.16

2020/12/17 DOTA

详解在Python的Django框架中创建模板库的方法

2015/07/20 Python

python类中super()和__init__()的区别

2016/10/18 Python

Python实现好友全头像的拼接实例(推荐)

2017/06/24 Python

Python中过滤字符串列表的方法

2020/12/22 Python

selenium携带cookies模拟登陆CSDN的实现

2021/01/19 Python

python实现录制全屏和选择区域录屏功能

2021/02/05 Python

HTML5声音录制/播放功能的实现代码

2018/05/03 HTML / CSS

西班牙在线宠物商店：zooplus.es

2017/02/24 全球购物

美国运动鞋类和服装零售连锁店：Shoe Palace

2019/08/13 全球购物

上海世博会口号

2014/06/19 职场文书

房产协议书范本2014

2014/09/30 职场文书

信息合作协议书

2014/10/09 职场文书

2014年党的群众路线活动个人整改措施

2014/10/28 职场文书

Centos环境下Postgresql 安装配置及环境变量配置技巧

2021/05/18 PostgreSQL

浅谈如何提高PHP代码质量之单元测试

2021/05/28 PHP

vue3 自定义图片放大器效果的示例代码

2022/07/23 Vue.js

JS前端可视化canvas动画原理及其推导实现

2022/08/05 Javascript