Question

第一个代码块是我想要变量select做的工作示例。 var select是变量tr中的td。变量tr在此代码中使用了2次。一旦表格有html时附加tr，另一次没有html时附加tr。原因是因为如果没有html它应该附加标题和行与select元素以及应该在行上的其余数据，如果有html它应该只追加防止重复标题的行。所以我想要一个名为tr的漂亮的干净变量，每次用户调用它时都会追加它。 jsfidle如果您点击下拉菜单，则可以选择该项目，系统会显示新行。

      $('#autocomplete').autocomplete({
         lookup: currencies,
        onSelect: function (suggestion) {
        var thehtml = '<strong>Item:</strong> ' + suggestion.value + ' <br>      <strong>price:</strong> ' + suggestion.data + "<br>" + suggestion.divs;
        var tableheader = ($("<thead>")
            .append($("<tr>")
                .append($("<th>Item</th><th>Qty</th><th>Price</th>")))
            )
      var select = " <select class = 'select'><option value='volvo>Volvo</option> <option value='saab'>Saab</option>  <option value='mercedes'>Mercedes</option> <option value='audi'>Audi</option> </select>"
  var tr = "<tr><td>"+ suggestion.value + "</td><td>" +select +"</td></tr>"

 if($(".table").html().length <= 0)
 {
    $('.table').append($("<table>")).append(tableheader).append(tr);
}else{
    if($(".table").html().length > 0){
        $(".table").append(tr)
    }

}

问题是我想要选择元素动态组成，所以我尝试了一些东西，但我无法弄清楚它为什么不起作用。它没有收到变量。我用$ .each实现了可变数据错误吗？

  $('#autocomplete').autocomplete({
lookup: currencies,
onSelect: function (suggestion) {
  var thehtml = '<strong>Item:</strong> ' + suggestion.value + ' <br> <strong>price:</strong> ' + suggestion.data + "<br>" + suggestion.divs;
  var tableheader = ($("<thead>")
            .append($("<tr>")
                .append($("<th>Item</th><th>Qty</th><th>Price</th>")))
            )

var  selectValues = { "3": "2", "2": "1" , "1": "..."};

 var select =  $.each(selectValues, function(key, value){
        $('.select').append($('<option>', {value: value}).text(value));
        // <option value='volvo>Volvo</option>
    });

  var tr = "<tr><td>"+ suggestion.value + "</td><td><select class ='select'>" + select + "</select></td></tr>";



 if($(".table").html().length <= 0)
 {
    $('.table').append($("<table>")).append(tableheader).append(tr);
}else{
    if($(".table").html().length > 0){
        $(".table").append(tr)
    }

}


},
maxHeight:100,
width:600

}）;

感谢您的帮助

Answer 1

如果仅使用值，为什么要使用对象？如果你真的不需要key juste创建一个数组：

var  selectValues = ["2", "1", "..."];
var value;

var select =  selectValues.forEach(function(value){
    $('.select').append($('<option>', {value: value}).text(value));
    // <option value='volvo>Volvo</option>
});
// or if you want more compatibility
for (var i = 0, len = selectValue.length; i < len; i++) {
    value = selectValue[i];
    $('.select').append($('<option>', {value: value}).text(value));
});

编辑：我犯了一些错误抱歉。首先，forEach将不返回任何内容，因此无法正常工作。我用你的fidle测试。试试这个（如果你不想使用map，请用old for循环替换。）

var select =  selectValues.map(function(value){
    return "<option value=" + value + ">"  + value + "</option>";
    // <option value='volvo>Volvo</option>
}).join('');

首先你不必从$（'。select'）追加，因为此时dom不存在并且你不能在这样的字符串中连接一个数组。

尝试将动态创建的select元素（标记）与选项连接到动态创建的表行

1 个答案: