Javascript 我想要复选框的行索引：签入表。用于使用deleteRow（）

我想知道checkbox:checked-in表的行索引。 我将对deleteRow（）使用此选项

javaScript代码

$j(document).ready(function(){
    var addFrmCnt = 0; //using for deletefrm button visible
    var count = 3; //using for checkbox value. it's table row
    var countCal=5;  //using for additional inputFrm numbering

    //For addFrm
    
    $j("#addFrm").on("click",function(){
        
        addFrmCnt = 1; //for deleteFrm display func Count 0=none, 1=inline
        
        var countFrm=0; //AddFrm Count
        
        if(count==3){
            countFrm=1;
        }else{
            countFrm= count-countCal;
            countCal=countCal+3;
        }
        
        $j("#table").append(
            "<tr><td align='center' colspan=2>Add Board INPUT"+countFrm
            +"<input type='checkbox' id='chkDelete' value='"+count+"'></td></tr>"
            +"<tr><td width='120' align='center'>Type</td><td><select id='typeSelect'>"
            +"<c:forEach items='${comCodeList}' var='list'><option value='${list.codeId}'>${list.codeName}</option></c:forEach>"
            +"</select></td></tr>"
            +"<tr><td width='120' align='center'>Title</td>"
            +"<td width='400'><input name='boardTitle' type='text' size='50'value='${board.boardTitle}' id='boardTitle'></td>"
            +"</tr><tr><td height='300' align='center'>Comment</td>"
            +"<td valign='top'><textarea name='boardComment'  rows='20' cols='55' id='boardComment'>${board.boardComment}</textarea></td></tr>"
        );
        
        //for deleteFrm display func
         if(addFrmCnt == 1){
                var deleteFrmStat = document.getElementById("deleteFrm");
                deleteFrmStat.style.display="inline";
            } 
        
        
         count=count+4;
    });
    
    //for deleteFrm
    
        $j("#deleteFrm").on("click",function(){
            /* var table = document.getElementById("table");
            var tableCnt = table.rows.length;
            console.log(tableCnt); */
            
            var chkList =[];
            
            $j('input[id="chkDelete"]:checked').each(
                    function() {
                        chkList.push($j(this).val());
                    });
            
            chkList.sort(function(a, b) { 
                return b - a;
            });
            
            console.log("chkList===="+chkList);
            
            for (var i in chkList){
                var iEnd=parseInt(chkList[i])+3;
                console.log("deleteRow==="+chkList[i]+"~"+iEnd);
                
                table.deleteRow(parseInt(chkList[i])+3);
                table.deleteRow(parseInt(chkList[i])+2);
                table.deleteRow(parseInt(chkList[i])+1);
                table.deleteRow(parseInt(chkList[i]));
                
            }
            
            var tableCnt = table.rows.length;
             if(tableCnt==3){
                 addFrmCnt == 0
                 var deleteFrmStat = document.getElementById("deleteFrm");
                 deleteFrmStat.style.display="none";
             }
             
            count=count-4;
        });

$j（文档）.ready（函数（）{
var addFrmCnt=0；//用于删除FRM按钮可见
var count=3；//用于复选框值。它是表行
var countCal=5；//用于其他输入FRM编号
//对于addFrm
$j（“#addFrm”）。在（“单击”，函数（）{
addFrmCnt=1；//对于deleteFrm display func Count 0=none，1=inline
var countFrm=0；//AddFrm Count
如果（计数=3）{
countFrm=1；
}否则{
countFrm=count countCal；
countCal=countCal+3；
}
$j（“#表”）。追加(
“添加板输入”+countFrm
+""
+“类型”
+“${list.codeName}”
+""
+“标题”
+""
+“评论”
+“${board.boardComment}”
);
//对于deleteFrm显示函数
如果（addFrmCnt==1）{
var deleteFrmStat=document.getElementById（“deleteFrm”）；
deleteFrmStat.style.display=“inline”；
} 
计数=计数+4；
});
//对于deleteFrm
$j（“#deleteFrm”）。在（“单击”，函数（）{
/*var table=document.getElementById（“表格”）；
var tableCnt=table.rows.length；
console.log（tableCnt）*/
var chkList=[]；
$j（'input[id=“chkDelete”]：checked'）。每个(
函数（）{
chkList.push（$j（this.val（））；
});
排序（函数（a，b）{
返回b-a；
});
log（“chkList==”+chkList）；
用于（chkList中的var i）{
变量iEnd=parseInt（chkList[i]）+3；
log（“deleteRow==”+chkList[i]+“~”+iEnd）；
表1.deleteRow（parseInt（chkList[i]）+3）；
表1.deleteRow（parseInt（chkList[i]）+2）；
表1.deleteRow（parseInt（chkList[i]）+1）；
表1.deleteRow（parseInt（chkList[i]）；
}
var tableCnt=table.rows.length；
如果（tableCnt==3）{
addFrmCnt==0
var deleteFrmStat=document.getElementById（“deleteFrm”）；
deleteFrmStat.style.display=“无”；
}
计数=计数-4；
});

HTML代码

<table align="center">
    <tr >
        
        <td align="right" style="float:right">
            <input id="addFrm" type="button" value="addFrm" style="margin:0 auto;">
            
            <input id="test" type="button" value="test" style="margin:0 auto;">
            
            <input id="deleteFrm" type="button" value="deleteFrm" style="display:none; margin:0 auto">

            <input id="submit" type="button" value="SUBMIT" style="margin:0 auto;">
        </td>

    </tr>
    <tr>
        <td>
            <table border ="1" id="table"> 
                <tr>
                    <td width="120" align="center">
                     Type
                    </td>
                    <td>
                        <select id="typeSelect">
                            <c:forEach items="${comCodeList}" var="list">
                                <option value="${list.codeId}">${list.codeName}</option>
                            </c:forEach>
                        </select>
                    </td>
                </tr>
                
                <tr>
                    <td width="120" align="center">
                    Title
                    </td>
                    <td width="400">
                    <input name="boardTitle" type="text" size="50" value="${board.boardTitle}" id="boardTitle"> 
                    </td>
                </tr>
                <tr>
                    <td height="300" align="center">
                    Comment
                    </td>
                    <td valign="top">
                    <textarea name="boardComment"  rows="20" cols="55" id="boardComment">${board.boardComment}</textarea>
                    </td>
                </tr>
            </table>
            <table border ="1">
                <tr>
                    <td width="120" align="center">
                    Writer
                    </td>
                    <td align="center" width="416">
                    <a>${memberName}</a>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
    <tr>
        
        <td align="right">
            <a href="/board/boardList.do">List</a>
        </td>
    </tr>
</table>

类型
${list.codeName}
标题
议论
${board.boardComment}
作家

我第一次使用checkbox中的表行（javascript 18行中的id chkDelete）值进行硬编码

当我第一次删除dfrm时，没有什么大问题。 但下一次我删除时遇到了大问题，那就是行号问题。 所以我认为最好保存复选框：复选框值中的选中行索引。而不是硬编码

如何获取表中checkbox:checked的行索引？

---

或者有更好的方法吗？

使用不同的方法，而不是查找所有复选框，循环遍历所有行（这样您就有了行索引），然后在每行中查找复选框，例如

$(table).find("tr").each(function(index, row){
    // index is index of the row
   var cb = $(row).find("input:checked");
  if (cb && cb.length > 0)
  {
      // do whatever here
  }

});

---

如果我没记错的话，在选中行中的复选框后，您将面临行索引问题

所以，我为您制定了解决方案，您可以在下面使用jquery查看。 让我们从答案开始

$（文档）.ready（函数（）{
$（“#我的按钮”）。单击（函数（）{
var message=“所选索引为：”；
//循环浏览GridView中的所有选中复选框。
$（“#mytable输入[类型=复选框]：选中”）。每个（函数（）{
var行=$（此）.tr[0]；
消息+=行。行索引+“”；
});
警报（信息）；
返回false；
});
})；

罗诺
名称
选择
1.
Emp1
2.
Emp2
3.
Emp3
4.
Emp4
罗诺
名称
选择

这正是我想要的。谢谢！我很高兴这对你有帮助