0

我对 JavaScript 非常陌生，我有一些基本的了解，但我的技能有限。

我需要创建一个 4 层下拉列表，每一层都取决于上一个条目。

它将是汽车制造商>>>汽车型号>>>>发动机尺寸>>>变体

当所有数据一起加载时，我发现了一个 jquery 教程，但是最终这些字段总共将有超过 1000 种不同的汽车变体，因此这会影响每个页面的加载时间。

在网上搜索解决方案时，我阅读了 AJAX，这听起来是解决我的问题的理想方法，但我发现的大多数 AJAX 教程和下拉列表都与 ASP.NET 数据库有关。我不需要将它链接到数据库我只需要依赖选择框功能

我想要的一个例子是Superchips Website左侧的工具，标题为“我的车辆将如何改进？” 我希望重新创建类似的东西。

人们可能获得的任何帮助或教程将不胜感激！

4

1 回答 1

1

如果您无权访问数据库服务器，也可以使用 JSON 文件。 http://www.secretgeek.net/json_3mins.asp

我建议您使用 jQuery 来满足该要求。如果您使用 JSON 文件，则可以使用$.ajax函数或$.getJSON函数。

这是我几周前编写的一个示例：

var strHtmlOutput = "";

$.getJSON('cities.json', function(data) {

        // Loop over all records in the json file
        $.each(data.cities, function() {        
            var strName = $(this).attr("name");
            var strCityId = $(this).attr("id");
            var strProvinceId = $(this).attr("provinceid");

                                strHtmlOutput += "<option value='" + strCityId + "'>";
            strHtmlOutput += strName;
            strHtmlOutput += "</option>";

        });     
    });

// Appending new records in the City dropdown list
$("#strCityId").append((strHtmlOutput);

JSON文件内容：

{
    "cities": [
    {
        "id": "1",
        "provinceid": "1",
        "name": "Montreal"
    },

    {
        "id": "2",
        "provinceid": "1",
        "name": "Quebec"
    },

    {
        "id": "3",
        "provinceid": "2",
        "name": "Ottawa"
    },

    {
        "id": "4",
        "provinceid": "2",
        "name": "Mississauga"
    },

    {
        "id": "5",
        "provinceid": "3",
        "name": "Vancouver"
    },

    {
        "id": "6",
        "provinceid": "3",
        "name": "Victoria"
    }

    ]
}

希望这可以帮助！

于 2012-07-11T19:10:29.987 回答