當我選擇第一條時會出現兩個undefined
邓
2018-05-11 16:45:28
0
6
1516

正确.png

這是正常選擇,如果我抽風會這樣

错误.png

邓

全部回覆(4)
邓

找到原因了,是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",

         type: "get",

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

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

        dataType: "1"},

        dataType: " json",

        success: function(data) {

            $("#provinces").html("<option value=''>請選擇省份> ");

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

                // alert(item.region_id);

                $("#provinces") 。 }

    });

    // 載入目前省所有城市

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

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

        $.ajax({

            type: "get",

##   _ type =2表示查詢城市

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

            dataTypeo:   dataType

            success: function(data) {

                $("#citys").html("<option value=''>

##                $("#countys").html("<option value=''>請選擇縣府</option>");

# . i, item) {

                if(i!="msg"){

                $("#citys").append("<option value='" + item.region_id + "'>" + item.region_name + "&ltion/option> #                }else{

#                $("#region").    

                });

            }

#        });

    });

    // 載入目前市所有縣

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

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

##        $.ajax({

            type: "get",

  reg        type: "get",

##o. ", // type =3表示查詢縣

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

            dataType: "

# json",

            success: function(data) {

                $("#countys").html("&ltoption value=''/option; ");

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

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

         #  se{  #                $("#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 ="您選擇的位址錯誤!地址是:"+"<input value='" + value + "'>");

        }else{

#        $("#region").empty();##        $("#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&gt ;

</table>

<h4 align="left">

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

</h4>

</body>

</html>

sky

有原始碼嗎?

  • 回覆 有明天上傳,就該動了教學裡面的一個文件
    作者 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(data, 函數(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(data, 函數(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學習者快速成長!