JS动态添加下拉框跟文本域

怎么点击增加出现新的一行下拉框跟文本域?还有点击删除按钮删掉我添加的那一行下拉框跟文本域... 怎么点击增加出现新的一行下拉框跟文本域?还有点击删除按钮 删掉我添加的那一行下拉框跟文本域 展开
 我来答
BUG集散地
推荐于2018-04-12 · TA获得超过1315个赞
知道小有建树答主
回答量:625
采纳率:80%
帮助的人:265万
展开全部

// 动态添加DOM元素,需要对DOM进行操作,不太清楚你对JQ了解如何,JQ会比较简单些;

//html代码

<html>
    <body>
        <button onclick="addRow()">添加</button>&nbsp;
        <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>
一别山水乡6
2016-06-01 · TA获得超过162个赞
知道小有建树答主
回答量:220
采纳率:100%
帮助的人:74.3万
展开全部
使用Jquery就可以了
追问
有详细的代码?能加QQ详情问吗?
追答
楼下正解
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式