zoukankan      html  css  js  c++  java
  • Checkbox的选中删除功能且Ajax返回后清除所选行

    转摘:http://javaweb1024.com/qianduan/jQuery/2015/04/13/544.html

    功能描述:多选框勾选以后(全部或者部分),需要想后台提交已勾选的数据(Ajax传输),并删除所选数据。一行的数据是以table来划分,页面要删除本行!

    代码 :

    存放 checkbox的ID值deleteIds=[];

    存放行table数据trs=[];           

    选中的checkbox:

    $targets=$("input[name='id']:checked");

    遍历选中的值

    $targets.each(function(i,o){

       trs.push($(this).closest("table"));                    

    deleteIds.push("deleteId="+$(this).val());           

    });

    Ajax的URL传递方式

    url: "deletes.jhtml?"+deleteIds.join("&"),

    Ajax返回以后删除选中的行

    $(trs).each(function(i,o){

                o.remove();

          });

    最后在Ajax的success中需要清空 deleteIds trs 

    附全选按钮JS代码:

    var $selectAll=$("input.select-all");
     $selectAll.click(function(){
        var $targets=$("input[name='id']");
        if($targets.length>0){
            if(this.checked){
                  $selectAll.attr("checked","checked");
                  $targets.attr("checked","checked")
            }else{
                   $selectAll.removeAttr("checked","checked");
                   $targets.removeAttr("checked","checked")
            }
        }
    });
  • 相关阅读:
    setTimeOut与循环闭包问题
    ES6----class用法
    JS------对象的继承方式
    JavaScript对象 -构建
    nodejs异步---Async
    mongdb位置索引
    mongodb 索引3
    mongod 索引2
    mongodb 索引1
    3 C++数据类型
  • 原文地址:https://www.cnblogs.com/zihan1120/p/4422260.html
Copyright © 2011-2022 走看看