Question

我的JS代码有以下内容。

$(document).ready(function () {
    var newOptions = "{'East': 'first','West': 'second', 'North': 'third'}";
    var option = $('#type_form');

    option.empty(); 

    $.each(newOptions, function(key, value) {
        option.append($('<option></option>').attr('value', value).text(key));
    });
});

HTML如下：

<select id="type_form">
    <option value="first">First</option> 
    <option value="second">Second</option> 
</select>

chrome中的JS控制台不会给我任何错误。所有选项标签都被删除，但它们不会被任何替换。

有什么想法吗？

Answer 1

newOptions应该是一个不是字符串的对象，

如果你把它作为一个字符串然后使用JSON.parse()将它解析为一个对象 - 对于像IE8这样没有本机JSON支持的浏览器你必须添加像json2这样的库

$(document).ready(function () {
    var newOptions = {"East": "first","West": "second", "North": "third"};
    var option = $('#type_form');

    option.empty(); 

    $.each(newOptions, function(key, value) {
        option.append($('<option></option>').attr('value', value).text(key));
    });
});

Answer 2

您必须解析您的JSON字符串：

$.each(JSON.parse(newOptions), function(key, value) {

编辑：我的回答是假设你的字符串来自其他地方。如果它真的是文字，最好直接将其写为文字对象，如Arun所示。

jQuery不会在select标签中追加附加选项标签

2 个答案: