使用键:值对填充选择框?

时间:2010-01-21 18:36:45

标签: javascript jquery

我正在使用jQuery并让服务器代码返回以下值

0:SELECT ONE;1:VALUE1;2:VALUE2 etc

如何将其填充到选择框中?

var="0:SELECT ONE;1:VALUE1;2:VALUE2";
$("#targetSelectBox"). ???????

4 个答案:

答案 0 :(得分:4)

var opts = "0:SELECT ONE;1:VALUE1;2:VALUE2";
opts = opts.split(';');
var target = $("#targetSelectBox");
$.each(opts, function(i, opt){
  opt = opt.split(':');
  target.append($('<option />').val(opt[0].trim()).text(opt[1].trim()));
});

答案 1 :(得分:1)

您还可以使用jquery的add()功能。

例如

var options = ["0":{"description":"Select an item"}, "1":{"description":"item 1"}];
var dropdown =  $("#dropdown_id")[0];
$.each(options, function(i, item) {
    var option = new Option(item.description, i);
    if ($.browser.msie) {
        dropdown.add(option);
    }
    else {
        dropdown.add(option, null);
    }
});

答案 2 :(得分:0)

// Variable holding key-value pairs
var values = "1:VALUE;2:VALUE";
// Convert to an array of key-values
var vals   = values.split(";");
// Cycle through each pair
for (var i = 0; i < vals.length; i++) {
  // Split to get true key, and true value
  var parts = vals[i].split(":");
  // Append new option holding true key, and true value
  $("#targetSelectBox").append($("option").val(parts[0]).text(parts[1]));
}

答案 3 :(得分:0)

它在Firefox中运行良好,但在IE中却没有。我得到“对象不支持属性或方法”。因此,我提出这个解决方案:

var target = $("#targetSelectBox")
var vals   = values.split(";");
for (var i = 0; i < vals.length; i++) {
  var parts = vals[i].split(":");
  target.append($('<option />').val(parts[0].trim()).text(parts[1].trim()));
}