如何通过js获取被用户选中的样式

80 阅读 0 评论 53 点赞

我是靠谱客的博主无聊学姐，最近开发中收集的这篇文章主要介绍如何通过js获取被用户选中的样式，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

1.通过样式变化做按钮的全选功能

具体代码如下：

js代码：
function CheckAll(checkbox3){
       var  id=document.getElementById("checkbox3");
      if(id.className.indexOf('schoolIdCancel')!=-1||id.className.indexOf('schoolIdAllCancel')!=-1){
           $(checkbox3).removeClass("schoolIdAllCancel");
         $(".schoolId").removeClass("schoolIdCancel");
      }else{
                 $(checkbox3).addClass("schoolIdAllCancel");
                 $(".schoolId").addClass("schoolIdCancel");
      }
         }

css代码：

.schoolId {
    width: 18px;
    height: 18px;
    background-color: white; /* Can be set to transparent */
    border: 2px #A7A7A7 solid;
    -webkit-border-radius: 15px;
    margin-left: 45px;
}

.schoolIdAll {
    width: 18px;
    height: 18px;
    background-color: white; /* Can be set to transparent */
    border: 2px #8E8E8E solid;
    -webkit-border-radius: 15px;
    margin-left: 12px;
}

2.将选中的数据的id通过样式传给后台

function dels(){
   if(!window.confirm("确定要删除吗?")){
      return;
   }
   var stIdArray =[];
   $(".schoolIdCancel").each(function(){
      stIdArray.push($(this).attr("value"));
   });
   if(stIdArray.length == 0){
      alert("请选择需要删除的内容");
      return ;
   }
   var ids = stIdArray.join(",");
   window.location.href= "deleteSchool.do?id="+ids;
}

3.后台action层代码

public String deleteSchool() throws SQLException, DataException {
   String schoolIds = request().getParameter("id");// 学校编号，通过ID进行拼接的，格式：1,2,3,4,5,6
   String[] schoolids = schoolIds.split(",");// 把字符串转为数组，学校编号格式就变为：[1,2,3,4,5,6]
   long i = 0;
   for (String str : schoolids) {// 遍历学校编号
      i = Convert.strToLong(str, -1);// 字符串转为数字
      if (i == -1) {// 转型失败，
         request().setAttribute("msg", "删除失败");
         return SUCCESS;
      }
   }
   if (schoolids.length <= 0) {// 如果数组里面没有值时，数据错误
      request().setAttribute("msg", "删除失败");
      return SUCCESS;
   }
   try {
      Long size = adminService.queryAdminBySchoolIds(schoolIds);
      if (size != -1) {
         request().setAttribute("msg", "删除学校失败，学校存在管理员");
         return SUCCESS;
      }
      size = teacherService.queryTeacherBySchoolIds(schoolIds);
      if (size != -1) {
         request().setAttribute("msg", "删除学校失败，学校存在老师");
         return SUCCESS;
      }
      size = studentService.queryStudentBySchoolIds(schoolIds);
      if (size != -1) {
         request().setAttribute("msg", "删除学校失败，学校存在学生");
         return SUCCESS;
      }
      schoolService.deleteSchools(schoolIds);// 根据学校编号组成的字符串进行删除
   }
   catch (SQLException e) {
      log.error(e);
      e.printStackTrace();
   }
   return SUCCESS;
}

4.后台Dao层代码

public Long deleteSchools(Connection conn, String schoolIds) throws SQLException {
   Dao.Tables.t_school t_school = new Dao().new Tables().new t_school();
   long returnId = t_school.delete(conn, " id in (" + StringEscapeUtils.escapeSql(schoolIds) + ")");// 对学校进行删除，删除条数返回到returnId上面
   return returnId;
}