gpt4 book ai didi

javascript - 使用一个 html 页面的下拉列表到另一个 html 页面

转载 作者:行者123 更新时间:2023-12-02 18:32:46 25 4
gpt4 key购买 nike

我有一个主 html5 页面 (main.html) 和另外两个 html5 页面(country.htmlstate.html)。

country.html 页面包含 250 个国家/地区的选择下拉列表,如下所示。

<select>
<option value="1">Afghanistan</option>
<option value="2">Albania</option>
.....
<option value="1">Canary Islands</option>
</select>

state.html 包含 250 个国家/地区的州的选择下拉列表,如下所示

<select id="1">
<option value="1">Badakhshan</option>
<option value="1">Badghis</option>
............
<option value="32">Zabol</option>
</select>

<select id="2">
<option value="33">Badakhshan</option>
<option value="34">Badghis</option>
............
<option value="68">Vlore</option>
</select>

...............
<select id="250">
<option value="4902">Saba</option>
<option value="4903">Sint Eustatius</option>
............
<option value="4915">Western Equatoria</option>
</select>

我必须在 main.html 中显示所有国家/地区的下拉列表,以及从国家/地区下拉列表中显示所选国家/地区所有州的另一个下拉列表。 main.html 如下所示

<select id="country">
like to add from country.html
</select>

<select id="state>
like to add from state.html
</select>

由于需要显示国家和州下拉列表超过 5 次,所以我喜欢使用 country.htmlstate.html。我怎样才能做到这一点?任何帮助或线索表示赞赏。提前致谢。

最佳答案

main.html

<div id="countries"></div>
<div id="states"></div>

jQuery 脚本

$(document).ready(function() {
// load select code from country.html
$('#countries').load('country.html select', function() {
// when country is selected
$('#countries select').change(function() {
// get id
var countryId = $(this).children('option:selected').val();
// load select code from state.html by id
$('#states').load('state.html #'+countryId, function() {
$('#states select').change(function() {
// use the same method to get state id
var stateId = $(this).children('option:selected').val();
});
});
});
});
});

关于javascript - 使用一个 html 页面的下拉列表到另一个 html 页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17646687/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com