超简单JS二级、多级联动的简单实例


Posted in Javascript onFebruary 18, 2014

超简单的JS联动代码,不过要配合jquery用,也可以自己修改为不用任选JS库的代码

<tr>
  <th>一级分类</th><td>
    <select name="subsidiary_cat_id" class="subsidiary_cat_id" onchange="linkage('.subsidiary_cat_id','.cat_id');">
      <option>请选择</option>
    </select>
    <script language="javascript">
    var linkage_data={$list_file_category};//初始化级联数据,{$list_file_category}是PHP的JSON_ENCODE的数据,数组有3个数据,id,parent_id,name
    function linkage(parent_dom,son_dom){
        var parent_id=0;
        if(parent_dom){
            parent_id=$(parent_dom).val();    
        }
        $(son_dom).empty();//先清空下拉
        var html='<option>请选择</option>';
        $.each(linkage_data,function(key,value){
            if(value.parent_id==parent_id){
                html+="<option value='"+value.id+"'>"+value.name+"</option>";
            }
        });
        $(son_dom).append(html);
    }
    linkage('',".subsidiary_cat_id")//不传上级节点,表示为第一级数据
    </script>
    </td></tr>
<tr><th>二级目录</th><td>
  <select name="cat_id" class="cat_id">
    <option>请选择</option>
  </select></td></tr>
Javascript 相关文章推荐
jQuery验证插件validation使用指南
Apr 21 Javascript
学习Bootstrap组件之下拉菜单
Jul 28 Javascript
微信小程序 使用腾讯地图SDK详解及实现步骤
Feb 28 Javascript
jQuery实现图片滑动效果
Mar 08 Javascript
对象不支持indexOf属性或方法的解决方法(必看)
May 28 Javascript
实例详解BootStrap的动态模态框及静态模态框
Aug 13 Javascript
微信小程序开发实现的选项卡(窗口顶部/底部TabBar)页面切换功能图文详解
May 14 Javascript
微信小程序实现录制、试听、上传音频功能(带波形图)
Feb 27 Javascript
JS实现瀑布流效果
Mar 07 Javascript
Vue自定义组件双向绑定实现原理及方法详解
Sep 03 Javascript
如何利用JavaScript编写一个格斗小游戏
Jan 06 Javascript
js前端图片加载异常兜底方案
Jun 21 Javascript
jquery easyui中treegrid用法的简单实例
Feb 18 #Javascript
DIV始终居中的js代码
Feb 17 #Javascript
jquery实现邮箱自动补全功能示例分享
Feb 17 #Javascript
JQuery与JS里submit()的区别示例介绍
Feb 17 #Javascript
按Enter键触发事件的jquery方法实现代码
Feb 17 #Javascript
清除div下面的所有标签的方法
Feb 17 #Javascript
JS控制一个DIV层在指定时间内消失的方法
Feb 17 #Javascript
You might like
一些操作和快捷键的理解和讨论
2020/03/04 星际争霸
PHP排序之二维数组的按照字母排序实现代码
2011/08/13 PHP
PHP生成随机密码类分享
2014/06/25 PHP
PHP连接MySQL数据的操作要点
2015/03/20 PHP
PHP进阶学习之垃圾回收机制详解
2019/06/18 PHP
CSS中一些@规则的用法小结
2021/03/09 HTML / CSS
一个js封装的不错的选项卡效果代码
2008/02/15 Javascript
javascript 同时在IE和FireFox获取KeyCode的代码
2010/02/07 Javascript
js中单引号与双引号冲突问题解决方法
2013/10/04 Javascript
代码获取历史上的今天发生的事
2014/04/11 Javascript
js获取会话框prompt的返回值的方法
2015/01/10 Javascript
JavaScript获取两个数组交集的方法
2015/06/09 Javascript
JS实现点击按钮获取页面高度的方法
2015/11/02 Javascript
Vue数据驱动模拟实现3
2017/01/11 Javascript
Angular4 中常用的指令入门总结
2017/06/12 Javascript
分享Bootstrap简单表格、表单、登录页面
2017/08/04 Javascript
angular2路由之routerLinkActive指令【推荐】
2018/05/30 Javascript
Angularjs 根据一个select的值去设置另一个select的值方法
2018/08/13 Javascript
小程序显示弹窗时禁止下层的内容滚动实现方法
2019/03/20 Javascript
js prototype和__proto__的关系是什么
2019/08/23 Javascript
python基础教程之缩进介绍
2014/08/29 Python
Python常用随机数与随机字符串方法实例
2015/04/09 Python
关于python pyqt5安装失败问题的解决方法
2017/08/08 Python
基于python socketserver框架全面解析
2017/09/21 Python
Python获取二维矩阵每列最大值的方法
2018/04/03 Python
对PyQt5的输入对话框使用(QInputDialog)详解
2019/06/25 Python
python 实现绘制整齐的表格
2019/11/18 Python
tensorflow使用range_input_producer多线程读取数据实例
2020/01/20 Python
keras输出预测值和真实值方式
2020/06/27 Python
Python利用Pillow(PIL)库实现验证码图片的全过程
2020/10/04 Python
美国知名的旅游网站:OneTravel
2018/10/09 全球购物
公司综合部的成员自我评价分享
2013/11/05 职场文书
李培根演讲稿
2014/05/22 职场文书
基层党支部整改方案
2014/10/25 职场文书
2015元旦主持词开场白和结束语
2014/12/14 职场文书
php 防护xss,PHP的防御XSS注入的终极解决方案
2021/04/01 PHP