zoukankan      html  css  js  c++  java
  • 二级菜单联动效果

    1. [代码]jsp页面     
    <tr>
                                    <td align="right" style=" 70px;">一级分类:</td>
                                    <td>
                                        <select id="cateOne" name="cateOne" onchange="changeCate();">
                                            <option value="0">---请选择----</option>
                                              
                                                        <option value="1">一级父菜单</option>
                                                     
                                                        <option value="2">二级父菜单</option>
                                                     
                                                        <option value="3">三级父菜单</option>
                                                     
                                                        <option value="4">四级父菜单</option>
                                                     
                                                        <option value="5">五级父菜单</option>
                                                     
                                                 </c:if>
                                        </select>
                                    </td>
                                 
                                 
                                </tr>
                                <tr height="35">
                                    <td align="right" style=" 70px;">二级类别:</td>
                                    <td>
                                        <select id="cateTwo" name="cateTwo" >
                                            <option value="0">---请选择----</option>
                                        </select>
                                         
                                    </td>
                                </tr>

    ​2. [代码]js     
    //类别级联
    function changeCate(){
        var  cateOne = $("#cateOne").find("option:selected").val();
        if(cateOne == 0) {春天图片
             $("#cateTwo").empty().append("<option value='0'>---请选择----</option>");
            return false;http://www.5idesk.com/s/chuntian/​
        }
        $.ajax({
            url:'<%=path%>/admin/menu_select',
            type:"post",
            dataType:"json",    
            data: {
                'ids' : cateOne
            },
          success: function (data) {
               $("#cateTwo").empty().append("<option value='0'>---请选择----</option>");
                for(var i=0,len=data.length;i<len;i++)
                {
                    $("#cateTwo").append($("<option value='"+data[i].id+"'>"+data[i].name+"</option>")); 
                }
                
          }
         }); 
    }

  • 相关阅读:
    PHP 截取字符串专题
    PHP获取文件扩展名的三种方法
    PHP万能密码登陆
    js正则表达式 验证手机号,email地址和邮政编码
    图片局部链接实例,方便自己用!
    通用客户端表单验证函数修正版
    C#事件的知识,转载学习
    C# byte及char FileStream 与StreamReader的区别(转)
    .Net下二进制形式的文件(图片)的存储与读取(转载)
    高斯克吕格坐标系中国部分定义(北京五四和西安80)(转,准确性使用性不敢保证)
  • 原文地址:https://www.cnblogs.com/xkzy/p/4486027.html
Copyright © 2011-2022 走看看