2 u013400939 u013400939 于 2015.07.20 10:25 提问

如何用jquery实现点击“删除”行删除后,选项重新排列;

如何用jquery实现点击“删除”行删除后,选项重新排列;
例我增加到10行后,我点击删除选项5,剩下的行按1-9重新排列

  <script>
 function add(){
         var val = $('#limit').val();
         var lastInput = $('#contain input:last');
         var phName = lastInput.attr('placeholder');
         phName = phName.replace("选项","");
         phName = parseInt(phName,10)+1;
         if(parseInt(val,10)>=parseInt(phName,10)){
              $('<div class="inputs"><input input type="text" id="option'+(phName)+'" name="option'+(phName)+'" maxlength="30" style="width: 80% "  placeholder="选项'+phName+' " /><span onclick=del(this)>删除</span></div>').insertAfter(lastInput.parent('div'));
         }else{
             alert('超出了最大项');
         }
    }
         </script>
  <tr id="tr">
        <td class="table_th" >题目选项:      
        <td width="" id="contain">
              <div class='inputs'>
              <input type="text" id="option1" name="option1"
            maxlength="30" style="width: 80%"  placeholder="选项1" value="${questionNaireQuestion.option1 }"/><font
          color="red"> *</font></div>

              <div class='inputs'><input type="text" id="option2" name="option2"
            maxlength="30" style="width: 80%"" placeholder="选项2"value="${questionNaireQuestion.option2 }" />&nbsp;</div>

              <div class='inputs'><input type="text" id="option3" name="option3"
            maxlength="30" style="width: 80% " " placeholder="选项3"value="${questionNaireQuestion.option3 }" /><span  onclick=del(this)>删除</span></div>

              <div class='inputs'><input type="text" id="option4" name="option4"
            maxlength="30" style="width: 80% "  placeholder="选项4" value="${questionNaireQuestion.option4 }"/><span  onclick=del(this)>删除</span></div>

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

            </td>
    </tr>

1个回答

danielinbiti
danielinbiti   Ds   Rxr 2015.07.20 10:37
已采纳
 function renew(){
         var inputs = $('#contain input[placeholder^="选项"]') ;
         for(var i=0;i<inputs.length;i++){
              $(inputs[i]).attr('placeholder','选项'+(i+1));
         }
         alert(inputs.length);
    }

 <input type="button" id="btnrefresh" name="btnrefresh" value="重新排列" onclick='renew()'/>
u013400939
u013400939 好的 了解了
2 年多之前 回复
danielinbiti
danielinbiti 回复Logica_: 已经有人给你思路了。要不就是${questionNaireQuestion.option1 }这些id在页面一个地方存起来。通过数组方式使用
2 年多之前 回复
u013400939
u013400939 回复danielinbiti: 恩 好的 哈哈 我还专门提了个问题
2 年多之前 回复
danielinbiti
danielinbiti 回复Logica_: 下午吧
2 年多之前 回复
u013400939
u013400939 类似这一行,给它添加value值用EL表达式取Session中的值,这里的value取得永远是${questionNaireQuestion.option1 },能让这个option与选项号匹配吗 $('<div class="inputs"><input input type="text" id="option'+(phName)+'" name="option'+(phName)+'" value="${questionNaireQuestion.option1 }" maxlength="30" style="width: 80% " placeholder="选项'+phName+' " /><span onclick=del(this)>删除</span></div>').insertAfter(lastInput.parent('div'));
2 年多之前 回复
u013400939
u013400939 能不能将点击添加的行中的value值中的EL表达式也与选项好匹配
2 年多之前 回复
u013400939
u013400939 谢谢
2 年多之前 回复
Csdn user default icon
上传中...
上传图片
插入图片