Question

我的一些代码存在一个小问题。 2选择通过以下代码填充

var data_business_type = [
{"category": "Automotive","type": "Please Select Type"}, 
{"category": "Automotive","type": "Auto Accessories "},
{"category": "Real Estate","type": "Please Select"},
{"category": "Real Estate","type": "Apartment & Home Rental"}/*problem here*/
];/*around 150 more 'types' in total*/

$('#r_businessCategory').append('<option selected>Please Select Category</option>');
$('#r_businessType').append('<option selected>Please Select Type</option>');
$('#r_businessOther').hide();

var r_categories = [];
 $.each(data_business_type, function(index, item) {
  if (r_categories.indexOf(item.category) < 0) {
   r_categories.push(item.category);
 };
});

$.each(r_categories, function(index, item) {
 $('#r_businessCategory').append('<option value=' + item + '>' + item + '</option>');
});

$('#r_businessCategory').on('change', function() {
 $('#r_businessType').empty();
  var business_types = [];
$.each(data_business_type, function(index, item) {
 if (business_types.indexOf(item.type) < 0 && $('#r_businessCategory').val() == item.category) {
  business_types.push(item.type);
 };
});

除非我希望“类别”包含多个单词，否则它应该起作用。 jsfiddle

我还在努力学习，所以我不知道如何使用所有括号，如果这会改变任何东西。我已经尝试寻找类似的问题但是当我尝试解决方案时，它会混淆不同的部分，所以我还没有找到一个有效的解决方案。抱歉，如果难以阅读。

任何帮助将不胜感激

Answer 1

如果属性值包含空格（或其他一些特殊字符），则必须将其放在引号中。总是在属性值周围加上引号通常是一个很好的理想选择。

$('#r_businessCategory').append('<option value="' + item + '">' + item + '</option>');

您还可以使用jQuery函数使用结构化参数创建元素。

$('#r_businessCategory').append($('<option>', { value: item }));

Answer 2

问题是当你调用val（）时它在空格后没有得到任何东西。快速解决方法是将空格转换为下划线，然后再重新执行。我相信别人会有更好的主意，但这很有效。

var data_business_type = [{
  "category": "Automotive",
  "type": "Please Select Type"
}, {
  "category": "Automotive",
  "type": "Auto Accessories "
}, {
  "category": "Real Estate",
  "type": "Please Select"
}, {
  "category": "Real Estate",
  "type": "Apartment & Home Rental"
}];
$('#r_businessCategory').append('<option selected>Please Select Category</option>');
$('#r_businessType').append('<option selected>Please Select Type</option>');
$('#r_businessOther').hide();

var r_categories = [];
$.each(data_business_type, function(index, item) {
  if (r_categories.indexOf(item.category) < 0) {
    r_categories.push(item.category);
  };
});

$.each(r_categories, function(index, item) {
  $('#r_businessCategory').append('<option value=' + item.replace(" ", "_") + '>' + item + '</option>');
});

$('#r_businessCategory').on('change', function() {
    alert($('#r_businessCategory').val());
  $('#r_businessType').empty();
  var business_types = [];
  $.each(data_business_type, function(index, item) {
    if (business_types.indexOf(item.type) < 0 && $('#r_businessCategory').val().replace("_", " ") === item.category) {
      business_types.push(item.type);
    };
  });
  $.each(business_types, function(index, item) {
    $('#r_businessType').append('<option value=' + item + '>' + item + '</option>');
  });
  $('#r_businessType').append('<option value=Other>Other</option>');
});

无法调用带空格的数组值

2 个答案: