前端.省市级联框

╰+哭是因爲堅強的太久メ 2023-08-17 15:20 134阅读 0赞

[前端.省市级联框][.]

var codeurl = ctx + "system/districts/list"
    
    //债务人省份
            $(function() {
                // 初始化省市区
                initAddress("#obligorLocation","#obligorCity");
                // 更改省份后的操作
                $("#obligorLocation").change(function() {
                    var provCode = $("#obligorLocation").val();
                    getCity(provCode,"#obligorCity");
                });
            });
            function initAddress(province,city) {
                var firstProvCode;
                // ajax请求所有省份
                //$(province).empty();
                $(province).append("<option value=''>-- 选择省 --</option>");
                $.post(codeurl, {
                    pid : 0
                }, function(data) {
                    $.each(data.rows,
                            function(i, d) {
                                $(province).append(
                                        "<option value='"+d.id+"'>" + d.extName
                                                + "</option>");
                            });
                    firstProvCode = data.rows[0].id;
                    // 根据第一个省份code获取对应城市列表
                    getCity(firstProvCode,city);
                }, 'json');
            }
            //获取对应城市列表（里面包括获取第一个城市的区县列表）
            function getCity(provCode,city) {
                // ajax请求所有市级单位
                $.post(codeurl, {
                    pid : provCode
                }, function(data) {
                    // 先清空城市下拉框
                    $(city).empty();
                    $(city).append("<option value=''>-- 选择市 --</option>");
                    $.each(data.rows,
                            function(i, d) {
                                $(city).append(
                                        "<option value='"+d.id+"'>" + d.extName
                                                + "</option>");
                            });
                }, 'json');
            }

<div class="form-group">
    <label class="col-sm-2 control-label">债务人所在区域:</label>
    <div class="form-inline col-sm-4">
    
    <select id="obligorLocation" name="obligorLocation" class="form-control">
    </select>
    <select id="obligorCity" name="obligorCity" class="form-control">
    </select>
    </div>
    </div>

posted on 2019-09-16 17:57  [Initial-X][] 阅读( ...) 评论( ...) [ 编辑][Link 1] 收藏

转载于:https://www.cnblogs.com/initx/p/11528724.html

[.]: https://www.cnblogs.com/initx/p/11528724.html
[Initial-X]: https://www.cnblogs.com/initx/
[Link 1]: https://i.cnblogs.com/EditPosts.aspx?postid=11528724

发表评论取消回复

表情：

评论列表（有 0 条评论，134人围观）

还没有评论，来说两句吧...

相关阅读

相关 js+jq实现选择框联动，已省市级联为例，超详细

jq的js文件需要自行官网下载或在联网情况下采用第三方jq库废话不多说直接上代码，注释超详细 <!DOCTYPE html> <html lang="e

柔情只为你懂/ 2023年10月08日 12:34/ 0 赞/ 63 阅读

相关前端.省市级联框

[前端.省市级联框][.] var codeurl = ctx + "system/districts/list" //债务人省份

╰+哭是因爲堅強的太久メ/ 2023年08月17日 15:20/ 0 赞/ 135 阅读

相关 java省市县级联查询

创建数据表 CREATE TABLE `platform_area_info` ( `id` int NOT NULL COMMENT '地区代码',

ゝ一纸荒年。/ 2022年09月09日 04:50/ 0 赞/ 186 阅读

相关搜索下拉框级联

$('\cat\_type').change(function()\{ var id = $(this).children(

左手的ㄟ右手/ 2022年08月10日 16:32/ 0 赞/ 291 阅读

相关【JQuery】——级联下拉框效果

【html】 <html> <head> <title>JQuery实例-级联下拉框效果</title> <meta http-

柔情只为你懂/ 2022年07月14日 01:37/ 0 赞/ 316 阅读

相关 js实现省市级联的简单代码

<!doctype html> <html> <head> <meta charset="utf-8"> <title>省市级联</ti

﹏ヽ暗。殇╰゛Y/ 2022年05月27日 08:08/ 0 赞/ 220 阅读

相关 Angular——级联框

近期接触的新页面需要做级联框查询，用Angular做还是第一次，对我来说好像是有点难度的，难到我的是当级联框第一个框选择一个值之后后边的框不仅要把相应的值都查回来放在下拉框

曾经终败给现在/ 2022年05月24日 06:12/ 0 赞/ 461 阅读

相关 jquery省市级联简单例子

ajax方式： $("\sf").change(function()\{ $("\shi").empty();//清空城市表 $("\shi").ap

Bertha 。/ 2022年05月17日 00:37/ 0 赞/ 208 阅读

相关 jQuery写省市区级联和理论多级级联和select下拉框删除除了第一行的所有option

写这篇文章是因为我在网上找了很多级联可是代码太繁琐还经常出bug 然后决定自己研究一下然后记录下来其实省市区级联没有想象的那么难多级级联也是先看

系统管理员/ 2022年05月15日 15:51/ 0 赞/ 149 阅读

相关 js快速实现省市级二级联动下拉框

由于逻辑简单，可以快速实现，我就直接上代码了。目前来说数据都应在数据库中，这个是偶然发现的一个代码，所以记录一下，以防万一使用； html部分 <div cla

梦里梦外;/ 2022年03月06日 10:22/ 0 赞/ 505 阅读