动态添加input

最新推荐文章于 2023-12-29 14:34:36 发布

原创最新推荐文章于 2023-12-29 14:34:36 发布 · 1.7k 阅读

1 ·

CC 4.0 BY-SA版权

页面：

<p>题目</p>
<input type="text" name="question[title]"/>
<p>选项</p>
<div id="spot">
    <input type="text" name="option[content1]"/><br>
    <input type="text" name="option[content2]"/><br>
</div>
<p></p>
<div id="spots">
    <input type="button" id="add" name="add" value="添加选项">
</div>

js:

{{--动态生成input--}}
    <script type="text/javascript">
        $(document).ready(function(){
            var spotMax = 30;
            var i=3;
            if($('div.spot').size() >= spotMax) {$(obj).hide();}
            $("input#add").click(function(){     addSpot(this, spotMax,i++);
            });
        });
var a;
        function addSpot(obj, sm,a) {
            $('div#spot').append(
                '<div class="spot">' +
                '<input type="text" name=option[content' + a + '] /> ' +
                '<input type="button" class="remove" value="Delete" /></div>')
                .find("input.remove").click(function(){
                $(this).parent().remove();
                $('input#add').show();
            });

            if($('div.spot').size() >= sm) {$(obj).hide();}
        };
    </script>