Question

如何使用java脚本创建动态下拉框，并在其中填充列表？这是我的小提琴，请帮忙！

按钮

$(document).ready(function(){
$("#b_id").click(function(){
    $("#div_id").append($('<select/>'));

})

});

http://jsfiddle.net/L4reds/wmqcd/

Answer 1

您可以在添加内部html like this时添加更多代码，它可以正常工作

$("#div_id").append($('<select><option value="1">one</option></select>'))

Answer 2

只需将此脚本添加到您的代码中我希望这对您有效：

请参阅此小提琴：JsFiddle

$(document).ready(function(){
    $("#b_id").click(function(){
        var drop_list = '<select>';
        drop_list += '<option value="Asia">Asia</option>';
        drop_list += '<option value="UK">UK</option>';
        drop_list += '<option value="USA">USA</option>';        
        drop_list += '</select>';    
        $("#div_id").append(drop_list);    
    })    
});

Answer 3

添加选项后，只需添加选项：

$("#b_id").click(function(){
    $("#div_id").append($('<select/>'));
    $("#div_id select").append($('<option value="1">one</option>'));
    $("#div_id select").append($('<option value="2">two</option>'));
});

Answer 4

您可以使用jQuery添加与select类似的选项。

.val() - 设置/获取元素值 .text() - set.get innerHTML元素

$('<option>').val('1').text('option1').appendTo($('select'));

您的代码：

$(document).ready(function(){
    $("#b_id").click(function(){
        $("#div_id").append($('<select/>'));
       $('<option>').val('1').text('option1').appendTo($('select'));       
    })

});

选中此fiddle

Answer 5

试试这个。

（文档）$。就绪（函数（）{ $（ “＃B_ID”）。单击（函数（）{

var cmbType = $("<select></select>").attr("id",'cmbType').attr("name", 'cmbType').attr("class", "rtctrl");
var Types = {
    0: '--Select--',
    1: 'DEED',
    2: 'FORECLOSURE',
    3: 'TAX SALE',
    4: 'ASSESSOR',
    5: 'RENTAL'
};
$.each(Types, function (val, text) {
    cmbType.append(
    $('<option></option>').val(val).html(text)
);
});

 $("#div_id").append(cmbType);
});

}）;

检查：http://jsfiddle.net/wmqcd/10/

使用javascript动态下拉按钮

5 个答案: