【问题标题】:jQuery count number of added table rowsjQuery计算添加的表格行数
【发布时间】:2017-08-26 18:35:52
【问题描述】:

我希望有人可以帮助我发现我的代码中的错误。我要做的是简单地计算最终用户添加到表中的表行数,如果表行不等于 2,则会弹出一个警告框。

这是我的html代码:

<table width="100%" border="0" cellspacing="0" cellpadding="0" id="details">
<tr>
<td colspan="7"><input name="addRow" type="button" class="add" value="Click Here to Add" id="addRow">
</td>
</tr>
<tr>
<td><input name="deleteRowButton" type="button" class="deleteRowButton" value="-" id="deleteRowButton" style="margin-top:15px;">
</td>
<td width="" align="left">
<select class="section" name="section" style="margin-top:15px;">
<option value="select">Select</option>
</select>
</td>
<td width="" align="left">    
<select>    </select>
</td>
<td width="" align="left">                
<select>   </select>
</td>
<td width="" align="left">                
<select>    </select>
</td>
<td width="" align="left">
<select>     </select>
<input type="text" value="" class="text" name="text" style="width: 100px;" />
</td>
<td width="" align="left">
<input type="text" /></td>
</tr>
</table>

这里是添加/删除功能:

    $("#addRow").live("click", function() {

        var row = $('#details tbody>tr:last').clone(true);
        context = $(this).parents("table").filter("#area"); 
        $("td input:text", row).val("");
        $("select option:selected", row).attr("selected", false);
        $("#details", context).append(row);
    });




$('.deleteRowButton').click(DeleteRow); 
       var rowCount = $('#details tr').length;         
       function DeleteRow()     {     
       if (rowCount == 2){
           alert($("#details tr").length);         
       } else {     
        $(this).parents('tr').first().remove();      
       } 
       }

谁能给我指出问题?

【问题讨论】:

  • 请发布html,或者使用jsFiddle
  • @CoolEsh,同意,我们可以看到标记以及添加行功能而不仅仅是删除吗?
  • 我根据您的要求修改了上面的代码

标签: javascript jquery count html-table row


【解决方案1】:

计算行数的行 (var rowCount = $('#details tr').length) 应该在 DeleteRow() 函数内。

【讨论】:

    【解决方案2】:

    应该是:

    if (rowCount != 2){ alert($("#details tr").length);
    } else {
    $(this).parents('tr').first().remove();
    }

    ?

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2010-12-25
      • 2010-11-12
      • 2021-03-19
      • 1970-01-01
      • 2010-09-15
      • 1970-01-01
      相关资源
      最近更新 更多