jquery无限级联下拉菜单简单实例演示

本文实例讲述了jquery无限级联下拉菜单代码以及jquery无限级联下拉菜单实现思路。分享给大家供大家参考。具体如下:

最终效果图:

jquery无限级联下拉菜单简单实例演示

因为是级联,所以数据必须是树型结构的,这里的测试数据如下:

jquery无限级联下拉菜单简单实例演示

看下效果图:

1、效果图一:

jquery无限级联下拉菜单简单实例演示

2、效果图二:

jquery无限级联下拉菜单简单实例演示

3、效果图三:

jquery无限级联下拉菜单简单实例演示

  由图可知,下拉框的个数并不是写死的,而是动态加载的。每当下拉框选择改变的时候,会发送一次ajax请求,请求成功返回json格式数据,当返回的数据不为空时(即有子节点时),则会向页面中添加一个下拉框,没有则不添加。

插件的实现代码如下:

(function ($) {
$.fn.CascadingSelect = function (options) {

//默认参数设置
var settings = {
url: “/Handler.ashx”, //请求路径
data: “0”, //初始值(字符串格式)
split: “,”, //分割符
cssName: “select”, //样式名称
val: “id”, //

© 版权声明

相关文章

暂无评论

none
暂无评论...