gpt4 book ai didi

javascript - 根据所选的州显示 马来西亚 城市

转载 作者:行者123 更新时间:2023-11-28 07:52:11 26 4
gpt4 key购买 nike

我想做一个马来西亚州和城市的下拉列表。

  • 这是我的初始页面:(test3.php)

enter image description here

  • 当我选择KL时,我对该城市的期望输出如下:

enter image description here

  • 当我选择雪兰莪时,我对该城市的预期输出如下:

enter image description here

  • 状态数据 json ($stateJsonObject)

    Array ( [0] => stdClass Object ( [stateId] => s1 [stateName] => Kuala Lumpur) 
    [1] => stdClass Object ( [stateId] => s2 [stateName] => Selangor))
  • 城市数据 json ($cityJsonObject)

    Array ( [0] => stdClass Object ( [cityId] => c1 [cityName] => Kajang [cityStateId] 
    => s2 ) [1] => stdClass Object ( [cityId] => c2 [cityName] => Seputeh
    [cityStateId] => s1 ) [2] => stdClass Object ( [cityId] => c3 [cityName] => Shah
    Alam [cityStateId] => s2 ) [3] => stdClass Object ( [cityId] => c4 [cityName] =>
    Klang [cityStateId] => s2 ) [4] => stdClass Object ( [cityId] => c5 [cityName] =>
    Kepong [cityStateId] => s1 ))
  • 代码(test3.php)

    <html>
    <head>
    <script type="text/javascript">
    function showCity()
    {
    //state id from drop down list
    var stateId = state.options[state.selectedIndex].value;

    //CODE HERE
    }
    </script>
    </head>

    <body>
    <form action="test3.php" method="post">
    State:
    <select name="state" id="state" onchange="showCity();">
    <option value ="">select one</option>
    <?php
    for($i = 0; $i < count($stateJsonObject); $i++)
    {
    echo '<option value = '.$stateJsonObject[$i] -> stateId.'>';
    echo $stateJsonObject[$i] -> stateName;
    echo '</option>';
    }
    ?>
    </select>

    <br />

    City:
    <select name="city" id="city">
    <option value ="">select one</option>
    </select>
    </form>
    </body>
    </html>
  • 根据上述引用,以下是我的问题:
    (1) 如何在 CODE HERE 部分比较 js 和 php (json) 之间的 state id
    (2) 如何根据我在CODE HERE上选择的显示城市下拉列表 部分?

最佳答案

据我所知,您有两个选择:

1.) 将整个对象加载到一个“大”JSON 中并在 Javascript 中准备好 - 然后只需使用 JS 操作 select 即可。

2.) 如果第一名的表现不太好(biiiiig 数据)“惰性”加载选择 - 再次使用 AJAX - 并使用 JS 渲染选择。

所以 - 在可能的情况下使用 JS 进行所有操作,我认为这是最简单的:)

p.s.:在编写渲染选择的方法时 - 仔细考虑所有可能的场景,并为它们提供重置功能 - 它最终会帮助你:)

关于javascript - 根据所选的州显示 马来西亚 城市,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26652620/

26 4 0
文章推荐: jquery - 使用按钮更改 div 内容
文章推荐: html - 如何制作背景和边框整个视口(viewport)但将内容保留在容器内
文章推荐: html - 停止 DIV 相互移动
文章推荐: html - 多个
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com