jquery( 点击按钮出来文本框并限制文本框的个数)

// 首先呢  编辑这个文章  主要是用于和大家的交流  以便学习和交流!!
<div class="form-group" id="spots">
                            <label>选项</label>
                            <input type="button" class="form-control" id="add" value="添加选项"/>
                            <span><font color="#a9a9a9" size="2px">一个选择最多只可添加5个单选项!</font></span>
                        </div>





</pre><p>//接下来 我们就用使用jquery的代码来操作一下的部分</p><p><pre name="code" class="javascript"><script type="text/javascript">
    $(document).ready(function(){
        var spotMax = 5;
        if($('div.spot').size() >= spotMax) {$(obj).hide();}
        $("input#add").click(function(){addSpot(this, spotMax);
        });
    });

    function addSpot(obj, sm) {
        $('div#spots').append(
    '<div class="spot">'+
            '<br><input type="text" name="spot_title[]" />     '+
            '<input type="button" class="remove btn btn-xs btn-danger" value="Delete" /></div>')
    .find("input.remove").click(function(){
            $(this).parent().remove();
            $('input#add').show();
        });

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

//这样我们就可以简单的完成一个关于Jquery的点击按钮出来文本框的操作了!

此外千万不要忘记引用Jquery.js的文件噢 !


posted on 2016-08-19 10:57  如果蜗牛有爱情  阅读(232)  评论(0编辑  收藏  举报

导航