select 无限级联动。省市县三级联动。jquery插件

摘要:
Code=',//background json处理文件sid:'PP,CC,AA',//select iddv:',,',//初始值ft:'…请选择…,,';//生成select fv:','的第一个文本,//生成select pid的第一个值:0//最顶层的父ID,用于后台处理文件};$Fn表示。PCA=函数{//配置参数默认值=$.exde;varsid=默认值.sid.split(',');默认值.len=sid.length;GetA;//初始化//为{$.change;}}设置更改事件;函数GetA{vararrSid=defaults.sid.split(',');vararrDv=defaults.dv.split,',';vararrFt=defaults.ft.split(','');varrrFv=defaults.fv.split;//查找自己varself;varkk=0;if(str_id!

select 无限级联动。省市县三级联动。jquery插件第1张

  

/*

省市县 三级联动, 后台提取json数据
<script src="http://t.zoukankan.com/res/PCASelect.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function() {
        var defaults = {
            url: 'PCAget.ashx?code=',    //后台json处理文件
            sid: 'PP1,CC1,AA1',             //select的id
            dv: '350000,,',                    //初始值
            ft: '...请选择...,,'        //生成selec的第一项 文本
        };
        $("kk").PCA(defaults);
    });  
</script>



后台文件:PCAget.ashx
<%@ WebHandler Language="C#" Class="PCAget" %>
using System;
using System.Web;
using System.Text;
using System.Data;
using LC.Data.Helper;

public class PCAget : IHttpHandler {
    public void ProcessRequest (HttpContext context) {
        // 数组   [{"id":"275","name":"A1"},{"id":"319","name":"A2"},{"id":"322","name":"A3"}]
        string code = context.Request["code"];
        string strSQL = "select * from s_PCA where parent='" + code + "'  order by Sort ";

        DataTable dt = appData.Instance().ExecuteDataset(strSQL).Tables[0];
        StringBuilder strClass = new StringBuilder();
        if (dt != null)
        {
            strClass.Append("[");
            for (int i = 0; i < dt.Rows.Count; i++)
            {
                strClass.Append("{");
                strClass.Append("\"id\":\"" + dt.Rows[i]["code"].ToString() + "\",");
                strClass.Append("\"name\":\"" + dt.Rows[i]["name"].ToString() + "\"");

                if (i != dt.Rows.Count - 1)
                {
                    strClass.Append("},");
                }
            }
        }
        strClass.Append("}");
        strClass.Append("]");      
        context.Response.ContentType = "application/json";
        context.Response.ContentEncoding = Encoding.UTF8;
        context.Response.Write(strClass.ToString());
        context.Response.End();
    }
    public bool IsReusable {
        get {
            return false;
        }
    }
}


*/


(function($) {
    var defaults = {
        url: 'PCAget.ashx?code=',    //后台json处理文件
        sid: 'PP,CC,AA',             //select的id
        dv: ',,',                    //初始值
        ft: '...请选择...,,',        //生成selec的第一项 文本
        fv: ',,',                    //生成selec的第一项 值
        pid: 0                       //最顶级的父ID ,用于后台处理文件
    };

    $.fn.PCA = function(options) {
        //配置参数
        defaults = $.extend({}, defaults, options);
        var sid = defaults.sid.split(',');
        defaults.len = sid.length;

        GetA("", defaults.pid); //初始化

        //设置change事件
        for (var i = 0; i < sid.length; i++) {
            $("#" + sid[i]).change(function() {
                GetA($(this).attr("id"), $(this).attr("value"))
            });
        }
    };

    function GetA(str_id, pid) {
        var arrSid = defaults.sid.split(',');
        var arrDv = defaults.dv.split(',');
        var arrFt = defaults.ft.split(',');
        var arrFv = defaults.fv.split(',');

        //找出自己
        var self;
        var kk = 0;
        if (str_id != "") {
            while (kk <= arrSid.length) {
                kk++;
                if (arrSid[kk - 1] == str_id)
                    break;
            }
        }
        self = $("#" + arrSid[kk]);

        //清空从自己开始之后所有项
        for (var i = kk; i <= arrSid.length; i++) {
            $("#" + arrSid[i]).html("");
        }

        //当前下拉框的第一个选择项
        if (arrFt[kk] != "")
            self.append("<option value='" + arrFv[kk] + "'>" + arrFt[kk] + "</option>");

        //添加option
        $.getJSON(defaults.url + pid, function(data) {
            for (var i = 0; i < data.length; i++) {
                var $opt = $("<option></option>").val(data[i].id).html(data[i].name);
                if (arrDv[kk] == data[i].id) $opt.attr("selected", "selected");
                self.append($opt);
            };

            //孩子下拉框
            if (arrSid[kk + 1] != undefined)
                GetA(arrSid[kk], self.attr("value"));
        });
    }
})(jQuery);     

免责声明:文章转载自《select 无限级联动。省市县三级联动。jquery插件》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇Vue通过build打包后 打开index.html页面是空白的[因为离职, 所以转一篇文章]Michael专栏NO.82:留住背影下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

hive基础1

Hive基础 1、介绍 Hive是OLAP(online analyze process,在线分析处理)。通常称为数据仓库,简称数仓。内置很多分析函数,可进行海量数据的在线分析处理。hive构建在hadoop之上,使用hdfs作为进行存储,计算过程采用的是Mapreduce完成,本质上hive是对hadoop的mr的封装,通过原始的mr方式进行数据处理与分...

jqgrid 事件说明

Events(事件) 事件响应动作被设置为表格的属性,以下定义了行被选中时的响应: var lastSel; jQuery("#gridid").jqGrid({ ...    onSelectRow: function(id){       if(id && id!==lastSel){          jQuery('#gridid'...

layui在open弹出层回显,解决动态select数据回显问题

//监听数据表格工具条         table.on('tool(contentList)', function(obj){ //注:tool是工具条事件名,test是table原始容器的属性 lay-filter="对应的值"             var data = obj.data //获得当前行数据                 ,lay...

JQuery实现表格的相同单元格合并的三种方法

表格中相同单元格合并是经常需要用到的,针对自己做的方法做个小总结,先看一下合并前效果图, 合并后的效果图: 代码: <!DOCTYPE html><html>  <head>    <title>merge.html</title>     <meta http-equiv="keyword...

MyBatis

为什么使用mybatis: 在知道为什么使用mybatis之前,我们先了解java如何进行jdbc访问数据库的。第一是从连接池取出或者自己创建Connection对象,第二是从Connection对象中创建出Statement对象,第三,根据Statement对象去执行SQL语句,第四,获取执行SQL语句的返回结果并处理,第五,关闭数据库。在这几个步骤中,...

[mybatis]list的foreach的使用

当传入参数为list的时候foreach的使用 当参数为一个list的时候 方法层: int deleteAll(List<String> list); xml文件中的sql语句 <delete parameterType="list"> delete from classify where id in <...