php处理表单中的复选框问题以及js实现全选
做的一个项目中遇到了全选和取消全选的问题，这是一个很普遍的功能，，虽然我们经常用到，但是真正做起来却发现行不通，在网上找了些，大部分都是ie，但是谷歌内核浏览器不能正常实现，所以经过小小的调整，今天就把调试好的代码发上来供大家参考使用。
首先要记得引用jquery框架，这样写起代码来相对容易点，尤其突出在选择器上。
<html>
<head>
<script src="./libs/js/jquery.min.js"></script>
<script>
$(document).ready(
function(){
alert("c");
}
);
function check(){
alert("检查选项");
$("input").css("background-color","blue");
$("input[name='one']:checked").css("background-color","red");
}
var c="Hello";
function msg(){
document.write(c);
}
function checkAll(){
$("input:checkbox").each(function(){
this.checked=true;
});
}
function Uncheck(){
$("input:checkbox").each(
function(){
this.checked=false;
});
}
</script>
</head>
<body>
<form name='thef' action='./99.php' method='post' >
<input type='checkbox' name='one[]' value="ni">first<br/>
<input type='checkbox' name='one[]' value="wo">second<br/>
<input type='checkbox' name='one[]' value="ta">third<br/>
<input type='text' name='four'>four<br/>
<p onclick="checkAll()">全选</p>
<p onclick="Uncheck()">取消全选</p>
<p onclick="check()">检查选择项 </p>
<input type='submit' value='提交'>
</form>
</body>
</html>
在表单 里面切记name一栏要有“[]",否则多个复选框同时提交，php只取最后一个。加上后就自然变成数组的样式了。
js中，function里面的this指代的是DOM对象，所以调用的方法在dom中才能查到，并不是jquery框架中的，这一点要清楚。网上有使用
$("input:checkbox").attr("checked","true");
这种方法来实现全选，经测试在ie中没问题，但是在谷歌浏览器出现问题，可以选中，但是取消全选时，表面上取消了，但是实际源码中并没有取消，所以在不刷新页面时，再次全选会发现无法选中的情况。
下面是php接收页面的处理方式：
<?php
$ch = $_POST['one'];
$c = $_POST['four'];
foreach($ch as $b)
{
echo $b."<br/>";
}
//var_dump($ch)."<br />";
//var_dump($c);
?>
这样就可以完成全选和取消全选的功能，当然，可以把二者合二为一，就出现我们经常用的效果了
php处理表单中的复选框问题以及js实现全选的更多相关文章
- springMvc接收ajax数组参数，以及jquery复选框选中、反选、全选、全不选
一.复选框选中.反选.全选.全不选 html代码: <input type='checkbox' name='menuCheckBox' value='10' >苹果 <input ...
- 转发！HTML 复选框 checkbox 的 JavaScript 的全选和全反选
checkbox 或者按钮实现 form 内的 checkbox 全选或者反选,代码很简单,全部代码如下: <html> <head> <meta http-equiv= ...
- JQuery的复选框选中、取消、全选，全不选问题
一.必须引入JQuery库: 下面是js代码: /*** * 服务管理块>>>复选框事件处理 */ //服务管理复选框被选中.取消$(function(){ $("#Ser ...
- jquery如何判断checkbox（复选框）是否被选中 全选 反选
好长时间没用jq, 之前用的都是ng. 想着随便参考一下,结果被坑.因为这篇文章是09年的,也和当时jq的版本号有关,但是为什么在百度排名第一,百度果然坑人,以后还是google 给出坑人文章的链接 ...
- js之全选即点击全选标签可选择全部复选框
目标效果:网页全选功能,即点击全选标签可选择全部复选框 实现代码如下 <!DOCTYPE html> <html lang="en"> <head&g ...
- 复选框（checkbox）、多选框
1.需求分析 可同时选中多个选项,实现全选.全不选.反选等功能. 2.技术分析 基础的HTML.CSS.JavaScript. 3.详细分析 3.1 HTML部分 图示是一个列表加底部一段文字说明,列 ...
- Flutter学习(8)——CheckBox多选框使用及动态更改多选框数据
原文地址:Flutter学习(8)--CheckBox多选框使用及动态更改多选框数据 | Stars-One的杂货小窝 最近项目需求需要调整页面,记录一下实现过程 这次主要是要实现个评价页面,选择不同 ...
- 当鼠标点击input框时，想让全选input框的所有内容只需要加“onfocus="this.select();”就可以了
当鼠标点击input框时,想让全选input框的所有内容只需要加“onfocus="this.select();”就可以了
- 第十六篇 JS实现全选操作
JS实现全选 嗨,同学们好,老师这里是专门教同学解决一些针对性的问题,所以说综合起来,就要靠同学自己了. 这节课我们学一个很实用的东西,全选操作!比如淘宝这种商城对吧,我的购物车,我要全选购买,或 ...
随机推荐
- 对Qt下对话服务器客户端的总结（MyTcpServer与MyTcpClient）
在汇文培训老师给讲了这个例子.讲的挺好的 Qt编写聊天服务器与客户端主要用到下面两个类: QTcpSocket --- 处理连接的 QTcpServer --- 处理服务器,对接入进行响应,创建每个链 ...
- NSUserDefaults的使用，保存登录状态和设置的轻量本地化存储
NSDictionary* defaults = [[NSUserDefaults standardUserDefaults] dictionaryRepresentation]; if([[NSUs ...
- android参数传递的几种方法
Intent Intent i=new Intent(当前Activity.this,目标Activity.class); 1.传单值 传入: i. i.putExtra("名称" ...
- ue4竖排文本显示
最近发现中国风游戏中,经常会遇到旁白文字竖着显示的需求. 于是我首先找了找控件蓝图中的text有没有相关类似横竖文本框的选项,然而并无所获. 突然间灵机一动! 竖着显示不就是每个字一换行嘛! 说干就干 ...
- time模块简介
Python 程序能用很多方式处理日期和时间,转换日期格式是一个常见的功能. Python 提供了一个 time 和 calendar 模块可以用于格式化日期和时间. 时间间隔是以秒为单位的浮点小数. ...
- 某公司HP-EVA4400数据丢失的恢复方法和恢复全过程
一.故障描述1.设备清单一台HP-EVA4400控制器(型号:AG638-53011)三台HP-EVA4400扩展柜(型号为AG638-63001),和28块HP-FC磁盘(型号为300G FC硬盘) ...
- 蓝桥杯-分小组-java
/* (程序头部注释开始) * 程序的版权和版本声明部分 * Copyright (c) 2016, 广州科技贸易职业学院信息工程系学生 * All rights reserved. * 文件名称: ...
- 蓝桥杯- 奇妙的数字-java
/* (程序头部注释开始) * 程序的版权和版本声明部分 * Copyright (c) 2016, 广州科技贸易职业学院信息工程系学生 * All rights reserved. * 文件名称: ...
- 573. Squirrel Simulation
Problem statement: There's a tree, a squirrel, and several nuts. Positions are represented by the ce ...
- IOS中的UIScrollView
要引用UIScrollView 首先要遵循UIScrollViewDelegate协议 然后重写 //1.拖拽方法 -(void)scrollViewDidScroll:(UIScrollView * ...