在Ajax调用后填充额外的选择输入

Question

我有一个选择输入。当更改时，将触发以下内容：

$('#type').change(function() { 
    var selectedYear = $("#year option:selected").val(); 
    var selectedProduct = $("#product option:selected").val(); 
    var selectedType = $("#type option:selected").val(); 
    $.ajax({ 
     type: "get", 
     url: "./report", 
     data: { 
      year : selectedYear, 
      product : selectedProduct, 
      type : selectedType 
     } 
    }).done(function(data){ 
     var url = $('meta[name="base_url"]').attr('content'); 

     $('#displayImage').attr('src', ''); 
     $('#displayImage').attr('src', url + data); 
     $('#displayImage').css('display', 'block'); 
    }); 
}); 

它调用的url会触发一个函数，它基本上会用图像路径填充一个数组。一旦图像阵列填充，我做

if(!empty($imageArray)) { 
    return $imageArray; 
} 

现在在我的ajax调用完成部分我显示图像。如果数组只有一个图像路径，这工作正常。但是，如果数组中有多个图像路径，我需要显示一个额外的选择输入，以便他们可以选择合适的图像。

怎么可能实现这样的事情？

感谢

Answer 1

你需要有一个空的<选择>随时可以取消隐藏。一旦你有数据，你可以填写像这样的选择 -

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