小编use*_*700的帖子

使用json对象填充下拉列表

我已经设法使用json对象填充我的下拉菜单,该工作正常.目前我正在尝试根据从下拉列表中选择的选项显示隐藏div中的图像.由于json对象填充了下拉列表,我将如何检索图像数据.

HTML

<form>
    <fieldset id="autoHeight">
        <legend>pod</legend>
        <h2>Cars</h2>
        <select name="drop_down" id="dropDownCars">
            <option value="None" selected="Selected">Select type</option>
        </select>
    </fieldset>
</form>
<div id="showBmw" class="hidden">
    <a href="http://cdn.iphoneincanada.ca/wp-content/uploads/2012/08/white-bmw.jpg"></a>
</div>
Run Code Online (Sandbox Code Playgroud)

JSON文件

{
    Cars: [{
        "CarType": "BMW",
        "carID": "bmw123"
    }, {
        "CarType": "mercedes",
        "carID": "merc123"
    }, {
        "CarType": "volvo",
        "carID": "vol123r"
    }, {
        "CarType": "ford",
        "carID": "ford123"
    }]
}
Run Code Online (Sandbox Code Playgroud)

这是我使用jquery填充下拉菜单的方法.

$(document).ready(function() {
    $.getJSON("../cars.json", function(obj) {
        $.each(obj.cars, function(key, value) {
            $("#dropDownCars").append("<option>" + value.carsName + "</option>");
        });
    });
});
Run Code Online (Sandbox Code Playgroud)

在jfiddle的任何工作示例,将非常感谢!谢谢.

jquery json drop-down-menu

11
推荐指数
2
解决办法
7万
查看次数

标签 统计

drop-down-menu ×1

jquery ×1

json ×1