zoukankan      html  css  js  c++  java
  • 三级联动

    -1-

          //学校
           $.ajax({
               type: "post",
               contentType: "application/json",
               url: "/userinfo/getSPCList.do",
               data: "{level:1}",
               success: function(result) {
                  var op = "";
                  for(var i = 0; i < result.d.length; i++) {
                      op += '<option value=' + result.d[i].schoolID + '>';
                      op += result.d[i].schoolName;
                      op += '</option>';
                  }
                  $("#fSchool").append(op);
               }
           });
     
           //当学校改变时,专业改变
           $('#fSchool').change(function() {
               $('#fProfessional option:gt(0)').remove();
               $('#fClass option:gt(0)').remove();
               $.ajax({
                  type: "post",
                  contentType: "application/json",
                  url: "/userinfo/getSPCList.do",
                  data: "{proid:'" + $(this).val() + "'}",
                  success: function(result) {
                      var op = '';
                      for(var i = 0; i < result.d.length; i++) {
                         op += '<option value=' + result.d[i].professionID + '>';
                         op += result.d[i].professionName;
                         op += '</option>';
                      }
                      $('#fProfessional').append(profession);
                  }
               });
           });
    
           //当专业改变时,班级改变
           $('#fClass').change(function() {
               $.ajax({
                  type: "post",
                  contentType: "application/json",
                  url: "/useinfo/getClassList.do",
                  data: "{classID:'" + $(this).val() + "'}",
                  success: function(result) {
                      var op = '';
                      for(var i = 0; i < result.d.length; i++) {
                         op += '<option value=' + result.d[i].classID + '>';
                         op += result.d[i].className;
                         op += '</option>';
                      }
                      $('#fClass').append(op);
                  }
               });
           });

    --2--

        //学校改变时,专业改变
           $("#aSchool").change(function() {
               var thisOne = $(this);
               var schoolID = $(this).val();
               $(this).next().hide();
               $(this).next().next().hide();
               if(schoolID == "") {
                  $(this).next().html("<option value=''>请选择</option>");
                  $(this).next().next().html("<option value=''>请选择</option>");
                  return;
               }
               $.post("<c:url value='/userinfo/getSPCList.do'/>", {
                  level: 2,
                  parentID: schoolID,
                  ranNum: Math.random()
               },
    
               function(data) {
                   var result = eval('(' + data + ')');
                   if(result.msg == null) {
                      thisOne.next().show().html("<option value=''>请选择</option>");
                      for(var i = 0; i < result.data.length; i++) {
                          thisOne.next().append("<option value=" + result.data[i].spcID + ">" + result.data[i].spcName + "</option>");
                      }
                      thisOne.next().css({
                          visibility: ""
                      });
                   } else {
                      alert(result.msg);
                   }
               });
           });
    
           //专业改变时,班级改变
           $("#aProfession").change(function() {
               var thisOne = $(this);
               var professionID = $(this).val();
               thisOne.next().hide();
               if(professionID == "") {
                  thisOne.next().html("<option value=''>请选择</option>");
                  return;
               }
               $.post("<c:url value='/userinfo/getSPCList.do'/>", {
                   level: 3,
                   parentID: professionID,
                   ranNum: Math.random()
               },
               function(data) {
                   var result = eval('(' + data + ')');
                   if(result.msg == null) {
                       thisOne.next().show().html("<option value=''>请选择</option>");
                       for(var i = 0; i < result.data.length; i++) {
                           thisOne.next().append("<option value=" + result.data[i].spcID + ">" + result.data[i].spcName + "</option>");
                       }
                       thisOne.next().css({
                           visibility: ""
                       });
                   } else {
                       alert(result.msg);
                   }
               });
           });

    --3--

           //学校、专业、班级三级联动
           function changeSpc(leavel) {
               var spcID = 0;
               if(leavel == 1) {
                  spcID = $("#schoolID").val();
               } else if(leavel == 2) {
                  spcID = $("#professionID").val();
               } else {
                  alert("数据错误");
                  return false;
               }
               $.getJSON("<c:url value='/spclass/getSpclassListByParent.do'/>", {
                 spcID: spcID,
                   ranNum: Math.random()
               },
               function(result) {
                   if(result.status == 0) {
                      alert(result.msg);
                   } else if(result.status == 1) {
                      if(leavel == 1) {
                          $("#professionID").attr("disabled", false);
                      } else if(leavel == 2) {
                          $("#classID").attr("disabled", false);
                      }
                      if(result.data.length >= 0) {
                          var optionHtml = "<option value='0'>---请选择---</option>";
                          for(var i = 0; i < result.data.length; i++) {
                              optionHtml += "<option value='" + result.data[i].spcID + "'>" + result.data[i].spcName + "</option>";
                          }
                          if(leavel == 1) {
                              $("#professionID").html(optionHtml);
                              $("#classID").html("<option value='0'>---请选择---</option>");
                          } else if(leavel == 2) {
                              $("#classID").html(optionHtml);
                          }
                      }
                  }
               });
           }

     

     

  • 相关阅读:
    linux清理内存
    华为代码注释标准
    Spring缓存机制的理解
    jQuery实现动态分割div—通过拖动分隔栏实现上下、左右动态改变左右、上下两个相邻div的大小
    模仿iframe框架,由分隔栏动态改变左右两侧div大小———基于jQuery
    js实现由分隔栏决定两侧div的大小—js动态分割div
    java基于socket的简单聊天系统
    中国移动归属地区号大全
    将本地光盘做成yum源
    windows下设置计划任务自动执行PHP脚本
  • 原文地址:https://www.cnblogs.com/whatarewords/p/10719467.html
Copyright © 2011-2022 走看看