在我的页面中,我有一个带有添加按钮的组合框。单击添加按钮时,如何在原始组合框下方创建新的组合框?如果再次单击,它将生成另一个组合框。每个组合框中的值是从数据库中调用的。
这是一个示例,尽管您必须自己计算中间层和后端部分。
示例:http://jsfiddle.net/9hvbt/3/
JavaScript
$('#btnAdd').click(function(){
//Use Ajax to talk to your server (middle tier)
$.ajax({
url: '/echo/json/', //Replace with your URL to return Database data (JSON format)
dataType: 'json',
type: 'get',
success: function(data){
//Use the returned data to pass into CreateDropDown (Hard coded for an example)
CreateDropDown(["Item 1", "Item 2", "Item 3"]);
}
});
});
function CreateDropDown(data){
var $newSelect = $('<select />');
$.each(data, function(i, val){
$newSelect.append($('<option />', {
'text':val
}));
});
$newSelect.appendTo('#dropDowns');
}
.HTML
<div id='dropDowns'>
<select>
<option>Item 1</option>
<option>Item 2</option>
<option>Item 3</option>
</select>
</div>
<input type='button' id='btnAdd' value="Add" />
编辑
你还应该阅读jQuery的AJAX方法
jquery有什么想法吗? jquery clone() 将帮助您解决此问题
JQuery .clone()
一个活生生的例子:
http://jsfiddle.net/laupkram/6LBNs/在你的问题的情况下,尝试研究这个
使用 jQuery 和 Ajax 动态加载 ComboBox