JS动态添加下拉框跟文本域
2个回答
展开全部
// 动态添加DOM元素,需要对DOM进行操作,不太清楚你对JQ了解如何,JQ会比较简单些;
//html代码
<html>
<body>
<button onclick="addRow()">添加</button>
<button onclick="deleteRow()">删除</button>
<div id="domOperate">
<!-- dom操作放在该DIV中进行 -->
</div>
</body>
</html>
//js代码,要先引入jquery.js
<script type="text/javascript" src="" ></script>//这里引入jquery插件
<script type="text/javascrpt">
//设置DOM操作父级元素
var $target = $('#domOperate');
//设置需要添加元素的模版
var $addRow = $('<div class="row"><select><option value="1">下拉框</option></select><input type="text" name="inputDom" /></div>');
//添加方法
var addRow = function(){
//对目标区域添加一行
$target.append($addRow);
}
//移除方法,此处移除最后一个添加的
var deleteRow = function(){
if($target.find('.row').length > 0){//判断是否还有添加的元素
$target.find('.row:last-child').remove();//找到最后一个删除
}else{
alert('已经没有可以删除的了');//此处也可以禁用按钮
}
}
</script>
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询
广告 您可能关注的内容 |