58问答库 > 如何用JS实现左边一个下拉列表选择一个值点击右边的添加按钮将选择的内容添加到一个div中

如何用JS实现左边一个下拉列表选择一个值点击右边的添加按钮将选择的内容添加到一个div中

2024-11-21 02:59:34

推荐回答（2个）

回答（1）：

用js和jQuery写了个demo，你自己完善下细节吧;

原生js实现




	
	添加取值


	
		jQuery入门
		jQuery精通
		angularjs入门
		angularjs精通
	
	添加

var add = document.getElementById('add'),
sel = document.getElementById('dataSource'),
choseContainer = document.getElementById('choosed');
add.onclick = function(){
if(sel.selectedIndex < 0){
return alert('请先选择分类');
}
var text = sel.options[sel.selectedIndex].innerHTML,
newNode = document.createElement("div");
newNode.innerHTML = text;
choseContainer.appendChild(newNode)
}

jQuery 实现：你需要将引入的jQuery src换成你本地的src




	
	添加取值


	
		jQuery入门
		jQuery精通
		angularjs入门
		angularjs精通
	
	添加

$('button').click(function(){
var dataSource = $('#dataSource :selected');
if(dataSource.length === 0){
return alert('请先选择分类');
}
var text = dataSource.text();
$('#choosed').append('

'+text+'

');
});

回答（2）：

有集成的jq插件直接用就行
不用自己做
例：ztree，dtree

如何用JS实现 左边一个下拉列表 选择一个值 点击右边的添加按钮 将选择的内容添加到一个div中

如何用JS实现左边一个下拉列表选择一个值点击右边的添加按钮将选择的内容添加到一个div中