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 相关文章推荐
用jquery实现下拉菜单效果的代码
Jul 25 Javascript
node.js正则表达式获取网页中所有链接的代码实例
Jun 03 Javascript
jquery实现submit提交表单
Feb 03 Javascript
jquery实现简洁文件上传表单样式
Nov 02 Javascript
Node.js检测端口(port)是否被占用的简单示例
Sep 29 Javascript
使用JS代码实现点击按钮下载文件
Nov 12 Javascript
vue.js删除动态绑定的radio的指定项
Jun 02 Javascript
jQuery中each循环的跳出和结束实例
Aug 16 jQuery
jQuery选择器中的特殊符号处理方法
Sep 08 jQuery
jQuery分组选择器简单用法示例
Apr 04 jQuery
浅谈JavaScript 声明提升
Sep 14 Javascript
JavaScript执行机制详细介绍
Dec 06 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
php IP及IP段进行访问限制的代码
2008/12/17 PHP
PHP中基本符号及使用方法
2010/03/23 PHP
ExtJS 2.0实用简明教程 之Border区域布局
2009/04/29 Javascript
jquery 注意事项与常用语法小结
2010/06/07 Javascript
javascript权威指南 学习笔记之null和undefined
2011/09/25 Javascript
JavaScript中文件上传API详解
2016/04/01 Javascript
Bootstrap轮播图的使用和理解4
2016/12/14 Javascript
详解nodejs 文本操作模块-fs模块(二)
2016/12/22 NodeJs
JS中Select下拉列表类(支持输入模糊查询)功能
2017/01/17 Javascript
Bootstrap 下拉多选框插件Bootstrap Multiselect
2017/01/22 Javascript
详解ES6中的代理模式——Proxy
2018/01/08 Javascript
vue 组件高级用法实例详解
2018/04/11 Javascript
详解Vue2.0组件的继承与扩展
2018/11/23 Javascript
微信小程序 自定义复选框实现代码实例
2019/09/04 Javascript
用原生JS实现爱奇艺首页导航栏代码实例
2019/09/19 Javascript
VUE注册全局组件和局部组件过程解析
2019/10/10 Javascript
使用webpack搭建pixi.js开发环境
2020/02/12 Javascript
浅谈JavaScript节流和防抖函数
2020/08/25 Javascript
js实现详情页放大镜效果
2020/10/28 Javascript
[00:11]战神迅矛
2019/03/06 DOTA
简单谈谈python中的lambda表达式
2018/01/19 Python
Django用户认证系统 User对象解析
2019/08/02 Python
Python 写入训练日志文件并控制台输出解析
2019/08/13 Python
python web框架 django wsgi原理解析
2019/08/20 Python
python中通过selenium简单操作及元素定位知识点总结
2019/09/10 Python
Python中使用socks5设置全局代理的方法示例
2020/04/15 Python
PyTorch在Windows环境搭建的方法步骤
2020/05/12 Python
英国知名化妆品网站:Revolution Beauty(原TAM Beauty)
2018/02/28 全球购物
微软台湾官方网站:Microsoft台湾
2018/08/15 全球购物
DJI全球:DJI Global
2021/03/15 全球购物
自荐信模版
2013/10/24 职场文书
电子商务应届生求职信
2013/11/16 职场文书
央视元宵晚会主持串词
2014/03/25 职场文书
故意伤害辩护词
2015/05/21 职场文书
预备党员党支部意见
2015/06/02 职场文书
解决spring.thymeleaf.cache=false不起作用的问题
2022/06/10 Java/Android