如何在javascript中过滤数据并填充组合框

Question

我正在考虑为国家和城市开展两个组合。

当用户在第一个组合中选择国家/地区时，其城市应填充在城市组合框中。

对于它：
1.）准备2个javascript变量：第一个包含国家/地区ID和名称，第二个包含城市ID，name和country_id

对于国家：
[
{"id":1, "title":"uk"},
{"id":3, "title":"US"},
{"id":6, "title":"CANADA"},
{"id":8, "title":"AUSTRALIA"}
]
和城市：
[
{"id":1, "country_id":1, "city":"LONDON"},
{"id":3, "country_id":1, "city":"Manchester"},
{"id":4, "country_id":2, "city":"New YORK"},
{"id":5, "country_id":2, "city":"New Jersey"},
{"id":8, "country_id":8, "city":"MELBOURN"}
]

现在：
1.）如何将上述国家/地区数据填充到国家/地区组合框中？ 2.）当用户选择国家时，如何将相关城市数据填充到城市组合框？

Answer 1

请参阅CSS-Tricks.com上的这篇文章：

• So You Need To Fill a Dropdown Dynamically

Answer 2

以下是链接组合框的一些教程： * http://www.javascriptkit.com/script/script2/multiplecombo.shtml * http://www.javascriptkit.com/script/cut183.shtml

Answer 3

我的男人我喜欢纯粹的JavaScript

倾听我将告诉你所有的东西

首先这是一个json对象，所以你需要使用eval函数

来评估它的字符串

var jsonobject = eval（json string）;

然后遍历此对象以绑定到ddl

所以

就像那样

用于通过js对象的数组和for for ddl

var ddl_countries = document.getElementById（'countriesdropdownid'） var ddl_country_option = document.createElement（'option'）; ddl_country_option.innerHTML =来自对象的文本//; ddl_country_option.value = value //来自对象; ddl_countries.appendChild（ddl_country_option）;

那为城市绑定

on onchange绑定城市同样的方式，如果你有兴趣获得更多描述我准备好告诉我你有兴趣，我会写完整的代码