u013400939
Logica_
2015-07-14 06:54
采纳率: 93.5%
浏览 3.6k

求助用Jquery实现,点击添加选项新增一行

求助用Jquery实现,点击添加选项新增一行,点击后增加选项五,再点击增加选项六

<table id="table_items" class="hovertable" style="width: 100%;" cellspacing="0"
    cellpadding="0">
    <tr id="tr">
        <td class="table_th" >题目选项:
        <td width="" id="contain"><input type="text" id="comment" name="comment"
            maxlength="30" style="width: 80%"  placeholder="选项一"/><font
            color="red"> *</font>
                <input type="text" id="title" name="title"
            maxlength="30" style="width: 80%"" placeholder="选项二" />
                <input type="text" id="commentx" name="comment"
            maxlength="30" style="width: 80% " " placeholder="选项三" />
                        <input type="text" id="commentx" name="comment"
            maxlength="30" style="width: 80% "  placeholder="选项四" />

            <div><a href="javascript:;" class="addRow" id="addText" onclick="javascript:add()">+添加选项</a></div>

            </td>
    </tr>
    </table>
  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

5条回答 默认 最新

  • danielinbiti
    danielinbiti 2015-07-14 07:58
    已采纳
     <script>
        function del(t){
             $(t).parent('div').remove();
        }
        function add(){
             var lastInput = $('#contain input:last');
             var phName = lastInput.attr('placeholder');
             phName = phName.replace("选项","");
             if(phName=='一'){
                  phName='二'
             }else if(phName=='二'){
                  phName='三'
             }else if(phName=='三'){
                  phName='四'
             }else if(phName=='四'){
                  phName='五'
             }else if(phName=='五'){
                  phName='六'
             }
             $('<div class="inputs"><input input type="text" id="commentx" name="comment" maxlength="30" style="width: 80% "  placeholder="选项'+phName+'" /><span onclick=del(this)>删除</span></div>').insertAfter(lastInput.parent('div'));
        }
    </script>
    <body> 
        <table id="table_items" class="hovertable" style="width: 100%;" cellspacing="0"
        cellpadding="0">
        <tr id="tr">
            <td class="table_th" >题目选项:        
            <td width="" id="contain">
                  <div class='inputs'>
                  <input type="text" id="comment" name="comment"
                maxlength="30" style="width: 80%"  placeholder="选项一"/><font
              color="red"> *<span  onclick=del(this)>删除</span></font></div>
    
                  <div class='inputs'><input type="text" id="title" name="title"
                maxlength="30" style="width: 80%"" placeholder="选项二" /><span  onclick=del(this)>删除</span></div>
    
                  <div class='inputs'><input type="text" id="commentx" name="comment"
                maxlength="30" style="width: 80% " " placeholder="选项三" /><span  onclick=del(this)>删除</span></div>
    
                  <div class='inputs'><input type="text" id="commentx" name="comment"
                maxlength="30" style="width: 80% "  placeholder="选项四" /><span  onclick=del(this)>删除</span></div>
    
                <div><a href="javascript:;" class="addRow" id="addText" onclick="javascript:add()">+添加选项</a></div>
    
                </td>
        </tr>
        </table>
    </body> 
    
    点赞 评论
  • T_zm_cross
    Zmin0707 2015-07-14 07:22

    $("#table_items").append("

    new row");
    点赞 评论
  • T_zm_cross
    Zmin0707 2015-07-14 07:23

    append 里传的是添加行的html代码

    点赞 评论
  • danielinbiti
    danielinbiti 2015-07-14 07:29
     function add(){
             var lastInput = $('#contain input:last');
             var phName = lastInput.attr('placeholder');
             phName = phName.replace("选项","");
             if(phName=='四'){
                  phName='五'
             }else if(phName=='五'){
                  phName='六'
             }
             $('<input input type="text" id="commentx" name="comment" maxlength="30" style="width: 80% "  placeholder="选项'+phName+'" />').insertAfter(lastInput);
        }
    
    点赞 评论
  • dcxy0
    Q544471255 2015-07-14 07:29

    这个

    参考:

    function add(nums){
    $("#contain").append(' maxlength="30" style="width: 80% " placeholder="选项'+nums+'" />');
    }
    大概这样就可以.

    另外,id是不可以重复的。

    点赞 评论

相关推荐