通过jquery创建选择和选项输入

时间:2013-11-28 06:28:57

标签: javascript jquery

有没有办法创建选择输入,就像我们可以在下面的jquery代码中进行文本输入一样。下面的代码不适用于Select。任何帮助将受到高度赞赏。

   counter = 1;
   var searchInput = $(' <input/>', {
     type: 'text',
     placeholder: 'Product Name',
     name: 'row['+counter+'][product_name]',
            class : 'txtvalue',
     id: 'project' + counter
 });

    var quarterInput = $(' <input/>', {
    type: 'select',
    value: ('1','2','3'),
    name: 'row['+counter+'][quarter]',
class : 'text', 
    id: 'project-quarter' + counter
});
var hidd = $('<input/>', {
    type: 'hidden',
    name: 'searchhid' + counter,
    id: 'project-id' + counter
});

newTextBoxDiv.append(searchInput).append("&nbsp;").append(quarterInput).append(hidd);
newTextBoxDiv.appendTo("#TextBoxesGroup");

3 个答案:

答案 0 :(得分:1)

试试这个

创建选择元素

var ddl = $("<select id=\"ddlId\" name=\"ddlName\" />");

现在在其中添加选项

var data = {
    '1': '1',
    '2': '2',
    '3': '3', 
}

for(var val in data) {
    $("<option />", {value: val, text: data[val]});
}

newTextBoxDiv.append(ddl);

您可以找到更多详情 - Read More

答案 1 :(得分:0)

没有<input type="select" />这样的内容,您要找的是select代码:https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select

在jQuery中,这将使用$('<select />')创建,然后您可以为其添加选项。为了阐明向选择添加选项的过程,您可以采取许多方法。如果你要重复这样做,我会创建一个工厂函数,返回一个像这样的选项列表:

var generate_options = function(values){
    var options = [];
    if('splice' in values){
        for(var i = 0; i < values.length; i++){
            options.push($('<option>'+values[i]+'</option>').val(values[i]));
        }
    }
    return options;
}

$('<select />').append( generate_options([1,2,3,4]) );

答案 2 :(得分:0)

试试这个



var data = {
    'foo': 'bar',
    'foo2': 'baz'
}


var s = $('<select />');

for(var val in data) {
    $('', {value: val, text: data[val]}).appendTo(s);
}

s.appendTo('body');