Original Fiddle使用第一个JSON文件
Failed Fiddle使用第二个JSON文件。
我无法使用split
和$.each
函数从数组中返回每个小选项。
我通过this site的AJAX使用链式选择框。它需要这样的标记来构建链式选择框:
<select>
<option value="mustang2000">Ford » Mustang » 2000</option>
<option value="mustang2005">Ford » Mustang » 2005</option>
<option value="focus">Ford » Focus » 2010</option>
<option value="alero">Oldsmobile » Alero » 1993</option>
</select>
通常,选项的JSON文件如下所示:
第一个JSON文件
[
{
"bigcat": "Sport",
"cat": "mainstream",
"choice": "football"
},
{
"bigcat": "Sport",
"cat": "mainstream",
"choice": "basketball"
},
{
"bigcat": "Sport",
"cat": "niche",
"choice": "MMA"
},
{
"bigcat": "Sport",
"cat": "niche",
"choice": "wrestling"
}
]
我希望使用“|”将相同类别的所有选项填充到一个大选项中作为分隔符,像这样:
第二个JSON文件
[
{
"bigcat": "Sport",
"cat": "mainstream",
"choice": "football|basketball"
},
{
"bigcat": "Sport",
"cat": "niche",
"choice": "wrestling|racing"
}
]
并在脚本中使用split
和$.each
函数返回每个小选项
$.ajax({
url: "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20json%20where%20url%20%3D%22http%3A%2F%2Fgoo.gl%2FqMlPxn%22&format=json&diagnostics=true&callback=",
success: function(data){
var $select = $('select');var $option="";
$.each(data.query.results.json.json, function (index, i) {
smallchoice = i.choice.split(',');
$.each(smallchoice,function(i,smallchoice){
$option = $("<option/>").attr("value", smallchoice).text(i.bigcat + "@" +( i.cat || "") +"@" + smallchoice);
});
$select.append($option);
});
$select.dynamicDropdown({"delimiter":"@"});
}
});
但我不知道如何为每个小选项分配bigcat
和cat
。谁能给我建议?
答案 0 :(得分:4)
您尝试手动解析Json对象。 Jquery不需要这样做。 Jquery有一个内置的parseJson()方法,可以将格式良好的json对象转换为javascript对象。或者,正如Liam建议的那样,您还可以在$ .ajax()选项中指定dataType是json,它将自动解析对象的结果数据响应。
然后你也可以使用数组[&#34;摔跤&#34;,&#34;赛车&#34;]而不是| -delimited列表供您选择。这两种方法相结合可以为您提供很多帮助并简化您的代码。
总结一下:将dataType:"json",
添加到ajax选项并使用数组存储选项而不是分隔列表。
(根据meta的建议更新评论)。