简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
当我选择第一条时会出现两个undefined
邓
邓 2018-05-11 16:45:28
0
6
1656

正确.png

这是正常选择，如果我抽风会这样

错误.png

邓
邓

全部回复(4)
╰倒轉流年丶祇爲一眼紅顔
╰倒轉流年丶祇爲一眼紅顔2018-06-10 23:41:00 4 楼

哥们，有空能不能把你这部分的完整代码给我看一下，我现在就是死活弄不出来这效果，看了很久也没看出哪儿有问题，多谢了

点赞 +0
添加回复
  • 回复 好的，你加我QQ908901178，我发给你
    邓 作者 2018-06-11 08:02:39
邓
邓2018-05-12 08:49:02 3 楼

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html" charset="UTF-8">

<title></title>

<style type="text/css">

#addr{width=60%;border-collapse:collpase;border:solid 1px Black;}

#addr td,#addr th{

border:1px solid Black;

padding:3px 7px 2px 7px;

}

</style>

刚刚的回答少了些开头的代码，现在补上。

点赞 +0
添加回复
邓
邓2018-05-12 08:46:55 2 楼

找到原因了，是region_action.php 当传入空值时会放回一个flag=false msg="查询类型有误"这个json回来

我将flag去掉了只返回msg 然后在region.html 里面遍历json时候判断msg的值

改动后region.html源码如下：

</style>

<script src="./jquery-2.2.3.js" type="text/javascript"></script>

<script type="text/javascript">

$(document).ready(function() {

    //  加载所有的省份

$.ajax({

        type: "get",

        url: "region_action.php", // type=1表示查询省份

        data: {"parent_id": "1", "type": "1"},

        dataType: "json",

        success: function(data) {

            $("#provinces").html("<option value=''>请选择省份</option>");

            $.each(data, function(i, item) {

                // alert(item.region_id);

                $("#provinces").append("<option value='" + item.region_id + "'>" + item.region_name + "</option>");

            });

        }

    });

    // 加载当前省所有市

$("#provinces").change(function() {

$("#region").empty();

        $.ajax({

            type: "get",

            url: "region_action.php", // type =2表示查询市

            data: {"parent_id": $(this).val(), "type": "2"},

            dataType: "json",

            success: function(data) {

                $("#citys").html("<option value=''>请选择市</option>");

                $("#countys").html("<option value=''>请选择县</option>");

                $.each(data, function(i, item) {

                if(i!="msg"){

                $("#citys").append("<option value='" + item.region_id + "'>" + item.region_name + "</option>");

                }else{

                $("#region").append(item);

                }                

                });

            }

        });

    });

    // 加载当前市所有县

$("#citys").change(function() {

$("#region").empty();

        $.ajax({

            type: "get",

            url: "region_action.php", // type =3表示查询县

            data: {"parent_id": $(this).val(), "type": "3"},

            dataType: "json",

            success: function(data) {

                $("#countys").html("<option value=''>请选择县</option>");

                $.each(data, function(i, item) {

                if(i!="msg"){

                        $("#countys").append("<option value='" + item.region_id + "'>" + item.region_name + "</option>");

                }else{

                $("#region").append(item);

                } 

                });

            }

        });

    });

// 显示地址

    $("#countys").change(function() {

    $("#region").empty();

    if($("#provinces").val()!="" && $("#citys").val()!="" && $("#countys").val()!=""){

        var value = $("#provinces").find("option:selected").text()

            + $("#citys").find("option:selected").text()

            + $("#countys").find("option:selected").text();

    }else{

    var value ="您选择的地址有误！";

    }

if($("#region")==""){

        $("#region").append("选择的地址是:"+"<input value='" + value + "'>");

        }else{

        $("#region").empty();

        $("#region").append("选择的地址是:"+"<input value='" + value + "'>");

        }

    });

});

</script>

</head>

<body>

<h1 align="left">省市县三级联动</h1>

<table id="addr">

<tr bgcolor="skybule">

<th>省份</th>

<th>市</th>

<th>县</th>

</tr>

<tr>

<th>

<select id="provinces">

<option value="">请选择省份</option>

</select>

</th>

<th>

<select id="citys">

<option value="">请选择市</option>

</select>

</th>

<th>

<select id="countys">

<option value="">请选择县</option>

</select>

</th>

</tr>

</table>

<h4 align="left">

<span id="region"></span>

</h4>

</body>

</html>


点赞 +0
添加回复
sky
sky2018-05-11 17:16:41 1 楼

有源码吗?

点赞 +0
添加回复
  • 回复 有明天上传，就该动了教学里面的一个文件
    邓 作者 2018-05-11 17:22:02
  • 回复 源码如下： <!DOCTYPE html> <html> &lt;头&gt; &lt;meta http-equiv="Content-Type" content="text/html" charset="UTF-8"&gt; <标题></标题> <样式类型=“text/css”> #addr{width=60%;border-collapse:collpase;border:solid 1px Black;} #addr td,#addr th{ 边框：1px 纯黑色； 内边距：3px 7px 2px 7px； } &lt;/风格&gt; &lt;脚本 src="./jquery-2.2.3.js" type="text/javascript"&gt;&lt;/script&gt; <脚本类型=“text/javascript”> $(文档).ready(函数() { // 加载所有的省份 $.ajax({ 类型：“获取”， url: "region_action.php", // type=1表示查询省份 数据：{“parent_id”：“1”，“类型”：“1”}， 数据类型：“json”， 成功：函数（数据）{ $("#provinces").html("<option value=''>请选择省份</option>"); $.each(数据, 函数(i, 项目) { // 警报(item.region_id); $("#provinces").append("<选项值='" + item.region_id + "'>" + item.region_name + "</option>"); }); } }); // 加载当前省所有城市 $("#provinces").change(function() { $("#region").empty(); $.ajax({ 类型：“获取”， url: "region_action.php", // type =2表示查询市 数据: {"parent_id": $(this).val(), "type": "2"}, 数据类型：“json”， 成功：函数（数据）{ $("#citys").html("<选项值=''>请选择城市</选项>"); $("#countys").html("<选项值=''>请选择县</选项>"); $.each(数据, 函数(i, 项目) { $("#citys").append("<选项值='" + item.region_id + "'>" + item.region_name + "</option>"); }); } }); }); // 加载当前市所有县 $("#citys").change(function() { $("#region").empty(); $.ajax({ 类型：“获取”， url: "region_action.php", // type =3表示查询县 数据: {"parent_id": $(this).val(), "type": "3"}, dataType: "json", success: function(data) { $("#countys").html("&lt;option value=''&gt;请选择县&lt;/option&gt;"); $.each(data, function(i, item) { $("#countys").append("&lt;option value='" + item.region_id + "'&gt;" + item.region_name + "&lt;/option&gt;"); }); } }); }); // 显示地址 $("#countys").change(function() { $("#region").empty(); if($("#provinces").val()!="" && $("#citys").val()!="" && $("#countys").val()!=""){ var value = $("#provinces").find("option:selected").text() + $("#citys").find("option:selected").text() + $("#countys").find("option:selected").text(); }else{ var value ="您选择的地址有误"; } if($("#region")==""){ $("#region").append("选择的地址是:"+"&lt;input value='" + value + "'&gt;"); }else{ $("#region").empty(); $("#region").append("选择的地址是:"+"&lt;input value='" + value + "'&gt;"); } }); }); &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;h1 align="left"&gt;省市县三级联动&lt;/h1&gt; &lt;table id="addr"&gt; &lt;tr bgcolor="skybule"&gt; &lt;th&gt;省份&lt;/th&gt; &lt;th&gt;市&lt;/th&gt; &lt;th&gt;县&lt;/th&gt; &lt;/tr&gt; &lt;tr&gt; &lt;th&gt; &lt;select id="provinces"&gt; &lt;option value=""&gt;请选择省份&lt;/option&gt; &lt;/select&gt; &lt;/th&gt; &lt;th&gt; &lt;select id="citys"&gt; &lt;option value=""&gt;请选择市&lt;/option&gt; &lt;/select&gt; &lt;/th&gt; &lt;th&gt; &lt;select id="countys"&gt; &lt;option value=""&gt;请选择县&lt;/option&gt; &lt;/select&gt; &lt;/th&gt; &lt;/tr&gt; &lt;/table&gt; &lt;h4 align="left"&gt; &lt;span id="region"&gt;&lt;/span&gt; &lt;/h4&gt; &lt;/body&gt; &lt;/html&gt;
    邓 作者 2018-05-12 08:09:23
热门专题
更多>
热门文章
热门教程
更多>
相关教程
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网：公益在线PHP培训，帮助PHP学习者快速成长！