Question

尝试从我的js文件中的数据列表中弹出一个下拉框。我已经找到了一些例子，但不完全是我想要做的。我希望它在下拉列表中显示'DataText'。

 <select id="select" </select>

脚本

 <script type="text/javascript" src="js/data/datafile.js"></script>

难道不能像这样简单吗？

    $(document).ready(function()
{
      $("#select").append(Mydata);
});

文件格式

var Mydata=[{"ID":"00","DataText":"Text1"}, {"ID":"01","DataText":"Text2"}, {"ID":"02","DataText":"Test3"}]

Answer 1

我建议：

$('#select').html(function(){
   return $.map(Mydata, function(v) {
      return '<option id='+ v.ID +'>'+ v.DataText +'</option>';
   }).join('');
});

http://jsfiddle.net/Y8eCy/

Answer 2

当然可以做到，但你必须迭代数据并添加所需内容。

$(document).ready(function () {
    for (var i = 0, count= Mydata.length; i < count; i++) {
        $('<option>').val(Mydata[i].ID).text(Mydata[i].DataText).appendTo("#select");
    }
});

这是一个快速解决方案，因此请添加错误检查。此外，如果这不是一个糟糕的粘贴作业，提供的HTML无效。开场选择标记需要>

Demo

Answer 3

您需要循环数据然后将其插入到select中，在这种情况下我需要解析数据。



var Mydata='[{"ID":"00","DataText":"Text1"}, {"ID":"01","DataText":"Text2"}, {"ID":"02","DataText":"Test3"}]';

var data = $.parseJSON(Mydata);

    $.each(data, function(k,v){
     $('#test').append('<option value="'+v.ID+'">'+v.DataText+'</option>');
    });

var Mydata='[{"ID":"00","DataText":"Text1"}, {"ID":"01","DataText":"Text2"}, {"ID":"02","DataText":"Test3"}]'; var data = $.parseJSON(Mydata); $.each(data, function(k,v){ $('#test').append('<option value="'+v.ID+'">'+v.DataText+'</option>'); });

工作示例：jsfiddle

使用外部javascript文件填充select元素

3 个答案: