列表页 删除操作(单选/多选)

来源:互联网 发布:淘宝试衣服软件 编辑:程序博客网 时间:2024/05/18 01:40

列表页 删除操作(单选/多选)

示例图片

  • js css选择器 jQuery each() js中json数组对象转字符串

html

<div class="app_list_cont user_news_list app_history_lists clear">                <table>                    <tr>                        <th class="select_del">                            <em class="app_checkbox_btn">                                <span><i class=""></i></span>                            </em>                        </th>                        <th>标题</th>                        <th>内容</th>                        <th>时间</th>                    </tr>                    <c:forEach items="${page.list }" var="comment">                    <tr class="single_list">                        <td class="single_del">                            <em class="app_checkbox_btn">                                <span><i class="" data-parentId="${comment.id}"  data-commentId="${comment.commentId}"></i></span>                            </em>                        </td>                        <td>${comment.title }</td>                        <td>${comment.cont }</td>                        <td>${comment.commentDate }</td>                    </tr>                    </c:forEach>                </table>

js

    <link rel="stylesheet" type="text/css" href="css/app-backstage.css">    <link rel="stylesheet" type="text/css" href="css/base.css">    <script type="text/javascript" src="js/jquery-3.2.0.min.js"></script><script src="js/base.js"></script><script type="text/javascript">$(function(){    //删除全选    $(".select_del").on("click",function(){        if($(this).find(".app_checkbox_btn span i").hasClass("app_checkbox_btn_i")){            $(".app_checkbox_btn span i").removeClass("app_checkbox_btn_i");        }else{            $(".app_checkbox_btn span i").addClass("app_checkbox_btn_i");        }    });    //删除单选    $(".single_del").on("click",function(){        $(this).find(".app_checkbox_btn i").toggleClass("app_checkbox_btn_i");    })    //删除操作    $(".circular_btn_red").off().on("click",function(){        if($(".single_list .app_checkbox_btn_i").length < 1){            errorBombBox("请选择需要删除的精选回复");            return false; //防止自动刷新页面        }else{            publicBox("删除精选回复", "确定删除选中的内容?", "");            $("#determine").off().on("click",function(){                $(".app_mask,.delete_box").fadeOut();                var data={};//声明data对象                var dataJson=[]; //声明数组      []表示数组,元素任意;    {}表示对象                $(".single_list .app_checkbox_btn_i").each(function(){                    var subJson = {parentId : $(this).attr("data-parentId") , commentId : $(this).attr("data-commentId")};                    dataJson.push(subJson);                })                //将数组对象转换为字符串                var jsonStr = JSON.stringify(dataJson);                data["ids"] = jsonStr;                data["reason"] = "删除原因";              //var jsonStr = [{'parentId:'11' , 'commentId':20} , {'parentId':'22' , 'commentId':26},{'parentId':'33' , 'commentId':30}]                //dataType : 'json',                //data : {'ids':jsonStr},                ajaxRequest( "/backstage/del.do",                        data,                         function(msg){                           if(msg.extension == "1"){                               window.location.reload();                           }else{                               errorBombBox(msg.message);//调报错弹框                           }                        }, 1);            })            return false;        }    });  });</script>

ajax工具

/** * Ajax请求 * @param url 请求URL * @param data 数据 * @param callback 回调方法 */function ajaxRequest(url, data, callback,isJson){    /*"&dround="+ Math.round(Math.random()*100)*/    if(isNotNull(data)){        if(isJson == 1){            data["dround"]= Math.round(Math.random()*100);        }else{            data += "&dround="+ Math.round(Math.random()*100);        }    }    $.ajax({           type: "POST",           url: url,           data: data,           async:false,           dataType:"json",           contentType: "application/x-www-form-urlencoded;charset=UTF-8",           success: function(msg){               console.log(msg);               if(callback == undefined){                   pop_reload(msg.message)               }else{                   callback(msg);               }           },           statusCode:{401:function(){               window.location.href=vbmappDomain;//重新加载首页,需要登录就会直接跳到登录页             }           }     });}/** * Ajax请求(跨域) * @param url 请求URL * @param data 数据 * @param callback 回调方法 */function ajaxRequestJsonp(url, data, callback){    /*"&dround="+ Math.round(Math.random()*100)*/    if(isNotNull(data)){        data += "&dround="+ Math.round(Math.random()*100)    }    $.ajax({           type: "POST",           url: url,           data: data,           async:false,           dataType:"jsonp",           jsonp: "callbackIngCare",//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(一般默认为:callback)           contentType: "application/x-www-form-urlencoded;charset=UTF-8",           success: function(msg){               if(callback == undefined){                   pop_reload(msg.message)               }else{                   callback(msg);               }           },           statusCode:{401:function(){               window.location.href=vbmappDomain;//重新加载首页,需要登录就会直接跳到登录页             }           }     });}

原创粉丝点击