使用 jQuery 和 Json 填充级联选择菜单

Question

我需要在三层级联菜单中显示数据，所有数据都通过 jsonp 填充（跨域问题）。将只有一个 jsonp 文件（每个子菜单不单独）。此外，jsonp 可以（应该）加载一次，而不是由每个连续的选择更改触发。

我在 jQuery 方面遇到了困难，弄清楚如何根据父选择过滤检索到的数据。以下是我到目前为止所拥有的：

HTML

<select id="typeFilter">
   <option value="" />  
</select>
<select id="typeFilter">
    <option value="" />
</select>
<select id="userFilter">
   <option value="" />
</select>

JSON

{"filters": {
    "productFilter": {
        "prod1": "Product 1",
        "prod2": "Product 2",
        "prod3": "Product 3",
    },
    "typeFilter": {
        "type1": 
            { 
                "Type 1": [
                    "subtype1": "Sub Type 1",
                    "subtype2": 
                        {
                            "Sub Type 2" : [
                                "subSubtype1": "Sub-Sub Type 1",
                                "subSubtype2": "Sub-Sub Type 2",
                                "subSubtype3": "Sub-Sub Type 3"     
                            ]
                        },
                    "subtype3": "Sub Type 3",
                ]
            },
        "type2": "Type 2",
        "type3": "Type 3",
    },
    "userFilter": {
        "user1": "user 1",
        "user2": "user 2",
        "user3": "user 3",
    }
}}

JQUERY

...这是我遇到问题的部分。

Answer 1

您尝试过解析 JSON 吗？

这将有助于开始一些非常简单的 jQuery 示例：http://docs.jquery.com/How_jQuery_Works

此页面将帮助您解析 JSON： http://api.jquery.com/jQuery.parseJSON< /a>

祝你好运