Javascript ingdropdown（生成模型）； }); 谢谢您的帮助！ var makesModels = { "Audi":{ "50": { "50 L(1974-1978)": ["Alternators", "

ingdropdown（生成模型）； });

---

谢谢您的帮助！

var makesModels = {
    "Audi":{
        "50": {
            "50 L(1974-1978)": ["Alternators", "Starter Motors"], 
            "50GL(1974-1978)": ["Alternators", "Starter Motors"] }, 
            "A1": {
                "A1 1.2TFSI(2010-)": ["Alternators", "Starter Motors"], 
                "A1 1.4TFSI(2010-)": ["Alternators", "Starter Motors"], 
                "A1 Sportback 2.0 TDI(2011-)":["Alternators","Starter Motors"]
            }
        },

    "Audi2":{
        "50": {
            "50 L(1974-1978)": ["Alternators", "Starter Motors"], 
            "50GL(1974-1978)": ["Alternators", "Starter Motors"] }, 
            "A1": {
                "A1 1.2TFSI(2010-)": ["Alternators", "Starter Motors"], 
                "A1 1.4TFSI(2010-)": ["Alternators", "Starter Motors"], 
                "A1 Sportback 2.0 TDI(2011-)":["Alternators","Starter Motors"]
            }
        },

    "Audi3":{
        "50": {
            "50 L(1974-1978)": ["Alternators", "Starter Motors"], 
            "50GL(1974-1978)": ["Alternators", "Starter Motors"] },
        "A1": {
            "A1 1.2TFSI(2010-)": ["Alternators", "Starter Motors"], 
            "A1 1.4TFSI(2010-)": ["Alternators", "Starter Motors"], 
            "A1 Sportback 2.0 TDI(2011-)":["Alternators","Starter Motors"]
        }
    }
}

function load_search()
{
    // Populate Makes
    jsonData = undefined;

    $.getJSON(makesModels, function (json) {
        jsonData = json;

        for (var make in jsonData) {
            var option = '<option value="' + make + '">' + make + '</option>';
            $("#make").append(option);
        }

        // Populate Models
        $("#make").on("change", function () {
            var selectedOption = $('#make option:selected').val();
            if (selectedOption !== "") {
                $("#model").html('<option value=""> -- select -- </option>');
                var make = $(this).val(),
                    models = jsonData[make];
                for (i = 0; i < models.length; i++) {
                    var option = '<option value="' + models[i] + '">' + models[i] + '</option>';
                    $("#model").append(option);
                }
                $("#model").prop("disabled", false);
            } else {
                $("#model").html('<option value=""> -- select -- </option>').prop("disabled", true);
            }

        });
    });
}

$(function () {
    load_search();
});

<fieldset>
    <div class="item">
        <label>Make</label>
        <select id="make">
            <option value="">-- Make --</option>
        </select>
    </div>
    <div class="item">
        <label>Model</label>
        <select id="model">
            <option value="">-- Model --</option>
        </select>
    </div>
    <div class="item">
        <label for="">Model</label>
        <select id="engine">
            <option value="">-- Engine --</option>
        </select>
    </div>
    <div class="item">
        <label for="">Parts</label>
        <select id="parts">
            <option value="">-- Parts --</option>
        </select>
    </div>
</fieldset>

$(document).ready(function()
    { 


var makesModels = {
    "Audi":{
        "50": {
            "50 L(1974-1978)": ["Alternators", "Starter Motors"], 
            "50GL(1974-1978)": ["Alternators", "Starter Motors"] }, 
            "A1": {
                "A1 1.2TFSI(2010-)": ["Alternators", "Starter Motors"], 
                "A1 1.4TFSI(2010-)": ["Alternators", "Starter Motors"], 
                "A1 Sportback 2.0 TDI(2011-)":["Alternators","Starter Motors"]
            }
        },

    "Audi2":{
        "50": {
            "50 L(1974-1978)": ["Alternators", "Starter Motors"], 
            "50GL(1974-1978)": ["Alternators", "Starter Motors"] }, 
            "A1": {
                "A1 1.2TFSI(2010-)": ["Alternators", "Starter Motors"], 
                "A1 1.4TFSI(2010-)": ["Alternators", "Starter Motors"], 
                "A1 Sportback 2.0 TDI(2011-)":["Alternators","Starter Motors"]
            }
        },

    "Audi3":{
        "50": {
            "50 L(1974-1978)": ["Alternators", "Starter Motors"], 
            "50GL(1974-1978)": ["Alternators", "Starter Motors"] },
        "A1": {
            "A1 1.2TFSI(2010-)": ["Alternators", "Starter Motors"], 
            "A1 1.4TFSI(2010-)": ["Alternators", "Starter Motors"], 
            "A1 Sportback 2.0 TDI(2011-)":["Alternators","Starter Motors"]
        }
    }
}

function populatecascadingdropdown(makesModels)
{
  var jsonData  = makesModels;
    for (var make in jsonData) {
            var option = '<option value="' + make + '">' + make + '</option>';
            $("#make").append(option);
        }

        // Populate Models
        $("#make").on("change", function () {
            var selectedOption = $('#make option:selected').val();
            if (selectedOption != "") {
                $("#model").html('<option value=""> -- select -- </option>');
                var make = $(this).val(),
                    models = jsonData[make];
                for (car in models) {
                    var option = '<option value="' + car + '">' + car + '</option>';
                    $("#model").append(option);
                }
                $("#model").prop("disabled", false);
            } else {
                $("#model").html('<option value=""> -- select  model-- </option>').prop("disabled", true);
            }

        });

                $("#model").on("change", function () {
            var selectedOption = $('#make option:selected').val();
            if (selectedOption != "") {
                $("#engine").html('<option value=""> -- select engine -- </option>');
                var model = $(this).val();
                 var models = jsonData[make];
                 var engines = models[model];
                for (ngin in engines) {
                    var option = '<option value="' + ngin + '">' + ngin + '</option>';
                    $("#engine").append(option);
                }
                $("#model").prop("disabled", false);
            } else {
                $("#model").html('<option value=""> -- select -- </option>').prop("disabled", true);
            }

        });

   $("#engine").on("change", function () {
            var selectedOption = $('#make option:selected').val();
             var selectedModel = $('#model option:selected').val();
            if (selectedOption != "") {
                $("#parts").html('<option value=""> -- select part -- </option>');
                var selectedengine = $(this).val();
                 var models = jsonData[make];
                 var engines = models[selectedModel];
                 var parts =  engines[selectedengine];
                for (var i = 0; i < parts.length; i++) {
                    var option = '<option value="' + parts[i] + '">' + parts[i] + '</option>';
                    $("#parts").append(option);
                }
                $("#parts").prop("disabled", false);
            } else {
                $("#parts").html('<option value=""> -- select -- </option>').prop("disabled", true);
            }

        });
    }
    populatecascadingdropdown(makesModels);
  });