jquery获取checkbox的值并post提交


Posted in Javascript onJanuary 14, 2015

废话不多说,直接奉上代码:

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <title></title>

    <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>

</head>

<body>

<?php

$data = $_POST['data'];

$arr = json_decode($data);

var_dump($arr);

$a = array(1,2,3,4);

foreach($a as $v){

    ?>

    <input type = "checkbox" class="checkbox" name="checkbox" value="<?=$v?>">

<?php

}

?>

<input type = "button" class="but_delet_choice" value="post">

</body>

<script>

    $('.but_delet_choice').click(function(){

        //获取全选之外的checkbox

        var $check_boxes = $("input[name='checkbox']:checked");

        if($check_boxes.length<=0){

            alert('您未勾选,请勾选!');

            return;

        }

        var array = new Array();

        $check_boxes.each(function(){

            var array_push = new Array();

            array_push.push($(this).val());

            array_push.push(2);

            array.push(array_push);

        })

        $.post(

            'test1.php',

            {

                data : JSON.stringify(array)

            }

        );

        return false;

    });

</script>

</html>
array(4) {

  [0]=>

  array(2) {

    [0]=>

    string(1) "1"

    [1]=>

    int(2)

  }

  [1]=>

  array(2) {

    [0]=>

    string(1) "2"

    [1]=>

    int(2)

  }

  [2]=>

  array(2) {

    [0]=>

    string(1) "3"

    [1]=>

    int(2)

  }

  [3]=>

  array(2) {

    [0]=>

    string(1) "4"

    [1]=>

    int(2)

  }

}

这里仅仅是简单实现下,给大家一个参考,小伙伴们可以自由扩展。

Javascript 相关文章推荐
深入理解JavaScript系列(3) 全面解析Module模式
Jan 15 Javascript
jquery滚动特效集锦
Jun 03 Javascript
浅谈JavaScript异常处理语句
Jun 26 Javascript
教你用javascript实现随机标签云效果_附代码
Mar 16 Javascript
jQuery事件的绑定、触发、及监听方法简单说明
May 10 Javascript
jQuery短信验证倒计时功能实现方法详解
May 25 Javascript
3种不同的ContextMenu右键菜单实现代码
Nov 03 Javascript
vue使用stompjs实现mqtt消息推送通知
Jun 22 Javascript
基于AngularJS的拖拽文件上传的实例代码
Jul 15 Javascript
解决vue build打包之后首页白屏的问题
Mar 06 Javascript
详解mpvue小程序中怎么引入iconfont字体图标
Oct 01 Javascript
elementUI select组件value值注意事项详解
May 29 Javascript
js打造数组转json函数
Jan 14 #Javascript
使用jquery 简单实现下拉菜单
Jan 14 #Javascript
jquery实现鼠标滑过小图时显示大图的方法
Jan 14 #Javascript
js实现禁止中文输入的方法
Jan 14 #Javascript
JavaScript 学习笔记之语句
Jan 14 #Javascript
JavaScript 学习笔记之操作符(续)
Jan 14 #Javascript
JavaScript 学习笔记之操作符
Jan 14 #Javascript
You might like
Windows Server 2008 R2和2012中PHP连接MySQL过慢的解决方法
2016/07/02 PHP
PHP生成各种随机验证码的方法总结【附demo源码】
2017/06/05 PHP
一个tab标签切换效果代码
2009/03/27 Javascript
js 实现无干扰阴影效果 简单好用(附文件下载)
2009/12/27 Javascript
JS trim去空格的最佳实践
2011/10/30 Javascript
定义JavaScript二维数组采用定义数组的数组来实现
2012/12/09 Javascript
js中prototype用法详细介绍
2013/11/14 Javascript
基于jquery扩展漂亮的CheckBox(自己编写)
2013/11/19 Javascript
js中文逗号转英文实现
2014/02/11 Javascript
关于JS数组追加数组采用push.apply的问题
2014/06/09 Javascript
使用js画图之饼图
2015/01/12 Javascript
JavaScript通过字典进行字符串翻译转换的方法
2015/03/19 Javascript
深入理解JavaScript中Ajax
2016/08/02 Javascript
JS中parseInt()和map()用法分析
2016/12/16 Javascript
Node.js使用NodeMailer发送邮件实例代码
2017/03/06 Javascript
vue-cli脚手架build目录下utils.js工具配置文件详解
2018/09/14 Javascript
BootStrap模态框闪退问题实例代码详解
2018/12/10 Javascript
[02:08]DOTA2英雄基础教程 马格纳斯
2014/01/17 DOTA
解读Python编程中的命名空间与作用域
2015/10/16 Python
利用Python生成文件md5校验值函数的方法
2017/01/10 Python
Python之ReportLab绘制条形码和二维码的实例
2018/01/15 Python
django使用xlwt导出excel文件实例代码
2018/02/06 Python
python3 自动识别usb连接状态,即对usb重连的判断方法
2019/07/03 Python
Django如何批量创建Model
2020/09/01 Python
详解python使用金山词霸的翻译功能(调试工具断点的使用)
2021/01/07 Python
html5 更新图片颜色示例代码
2014/07/29 HTML / CSS
用canvas做一个DVD待机动画的实现代码
2019/04/12 HTML / CSS
StubHub德国:购买和出售门票
2017/09/06 全球购物
斯凯奇澳大利亚官网:SKECHERS澳大利亚
2018/03/31 全球购物
英国外籍人士的在线超市:British Corner Shop
2019/06/03 全球购物
本科毕业生求职自荐信
2014/02/03 职场文书
学生偷窃检讨书
2014/09/25 职场文书
2015年挂职锻炼工作总结
2014/12/12 职场文书
教务处干事工作总结
2015/08/14 职场文书
2016大学生求职自荐信范文
2016/01/28 职场文书
Python Matplotlib绘制两个Y轴图像
2022/04/13 Python