使用jQuery / Json将值加载到HTML select中
我试图使用json字符串中的值动态地将值加载到选择中。
数据正确加载，但由于某种原因，只有第一个值加载到选择中。 任何人都可以发现为什么会这样吗？
这是我的JSON数据：
[{"cat_id":"1","cat_section":"pages","cat_type":"cat","cat_name":"Music","cat_order":"1","cat_parent_id":"0"},{"cat_id":"2","cat_section":"pages","cat_type":"cat","cat_name":"Arts & Culture","cat_order":"2","cat_parent_id":"0"},{"cat_id":"3","cat_section":"pages","cat_type":"cat","cat_name":"Travel & Escape","cat_order":"3","cat_parent_id":"0"},{"cat_id":"4","cat_section":"pages","cat_type":"cat","cat_name":"Technology","cat_order":"4","cat_parent_id":"0"}] 这是我的jQuery：
$("select#select_category").change(function(){ $.getJSON("ajax/categories/pages/" + $(this).val(), function(data){ var options = ''; for (var i = 0; i < data.length; data++) { options += '' + data[i].cat_name + ''; } $("select#select_subcategory").html(options); }) });
for (var i = 0; i < data.length; data++) {
应该显然是i++ 。
但一般情况下，您不应使用HTML字符串吊索创建动态页面内容。 当类别名称包含HTML标记中特殊的字符时，您的代码将失败。 如果用户可以输入类别，则会为您提供跨站点脚本安全漏洞。 相反，您可以使用jQuery 1.4创建快捷方式$(' ，或者更简单地在这种情况下使用new Option() 。 无论哪种方式都可以直接设置属性而不是嵌入到字符串中，因此您不必担心HTML转义问题。
此外，当您将字符串（或其他数据）从PHP吐出到JavaScript源代码时，您应该使用json_encode()来正确转换它们，否则您将遇到JavaScript字符串文字特有的字符问题（ ' ， " ， \和各种控制代码）或封闭的HTML文件（ ）。再次，也许这对你在这里的具体值无关紧要，但一般来说这些东西是许多安全敏感的逃逸问题的根源。
var siteurl= ; $('#select_category').change(function(){ $.getJSON(siteurl+'ajax/categories/pages/'+$(this).val(), function(data) { $('#select_subcategory').empty(); $.each(data, function() { $('#select_subcategory').append(new Option(this.cat_name, this.cat_id)); }); }); });
它应该是你的for循环中的i++而不是data++