<html>
<head>
<script>
function delte() {
var checkboxs = document.getElementsByName("c1");
var table = document.getElementById("mytable");
var allTrlength = table.rows.length;
var trIndex ;
for(var i=0; i<checkboxs.length; i++) {
for(var j=allTrlength - 1; j>0 ;j--) {
if(checkboxs[i].checked == true) {
table.deleteRow(checkboxs[i].parentNode.parentNode.rowIndex);
}
}
}
}
</script>
</head>
<body>
<table id="mytable">
<tr><td><input type="checkbox" name="c1"></td>
</tr>
<tr><td><input type="checkbox" name="c1"></td>
</tr>
<tr><td><input type="checkbox" name="c1"></td>
</tr>
<tr><td><input type="checkbox" name="c1"></td>
</tr>
<tr><td><input type="checkbox" name="c1"></td>
</tr>
<tr><td><input type="checkbox" name="c1"></td>
</tr>
</table>
<input type="button" value="delete" onclick="delte();">
</body>
</html>
分享到：
相关推荐
标题中提到的“javascript DOM操作之动态删除TABLE多行”指的是使用JavaScript编程语言来操作文档对象模型（DOM），实现网页上HTML表格（TABLE）的动态删除功能，特别是表格中的多行（tr）。在网页开发中，DOM允许...
Bootstrap Table 批量删除是指删除多个记录，通过在表格中选择多行记录，然后点击删除按钮，将其删除。Bootstrap Table 提供了多种方式来实现批量删除操作，包括通过按钮删除、通过右键菜单删除等。 在 Bootstrap ...
- `append()` 函数：将内容添加到元素内部，如 `$tr.append($td.clone().append("<input type='checkbox'.../>"))` 将新的复选框添加到 `<tr>` 元素内。 3. **动态生成表格数据**： - 使用 `for` 循环遍历JSON...
在IT领域，尤其是在Web开发和用户界面设计中，"复选框选中表格中的行进行删除行操作"是一项常见的功能需求。这个功能主要用于提供用户友好的数据管理方式，让用户能够批量选择并处理表格中的数据。下面我们将详细...
例如，通过添加`checkbox`元素并监听`change`事件，可以让用户通过复选框选择多行。此外，可以结合`data-*`属性存储行的额外信息，以便在选中行后进行更复杂的操作，如编辑、删除或导出数据。 以上就是使用jQuery...
- 使用`RowDeleting`事件处理删除操作，通过SQL命令从数据库中删除对应的数据。 - 使用`RowUpdating`事件处理保存编辑后的数据，并更新数据库。 - 使用`CancelEdit`方法取消编辑状态。 #### 3. GridView正反双向...
2. **其他输入类型**：`<input type="password">`密码框，`<input type="checkbox">`复选框，`<input type="radio">`单选按钮，`<select>`下拉菜单，`<textarea>`多行文本框。 3. **表单提交**：`<form>`标签定义...
通过`<p>`段落、`<h1>`至`<h6>`标题、`<strong>`加粗、`<em>`斜体、`<u>`下划线、`<del>`删除线等标签，可以实现文本的格式化。 4. HTML 链接与导航 `<a>`元素用于创建链接，通过`href`属性指向目标URL。`target`...
HTML表单通过`<form>`元素定义，常用输入元素有`<input>`（多种类型如text、password、checkbox、radio等）、`<textarea>`（多行文本输入）、`<select>`（下拉菜单）和`<button>`（按钮）。`<label>`与`<input>`关联...
6. **文本域**：`<textarea>`标签用于创建一个多行文本输入区域。可以指定其名称、列数和行数等属性。示例代码如下： ```html <textarea name="info" cols="40" rows="7"></textarea> ``` 7. **文件上传**：`...
通过在`GridView`的每一行添加一个`CheckBox`控件，用户可以选择多行数据进行批量操作，如删除、更新等。 **示例代码：** ```xml 选择"> <asp:CheckBox ID="CheckBox1" runat="server" /> ``` #### 七、...
表单包含多种输入元素，如`<input>`（type=text, password, radio, checkbox等），`<textarea>`用于多行文本输入，`<select>`和`<option>`创建下拉列表，`<button>`定义按钮。 9. **HTML5的新特性**：HTML5引入了...
表单元素是HTML交互性的关键，`<form>`定义表单，`<input>`创建输入字段，`<textarea>`用于多行文本输入，`<select>`创建下拉列表，`<option>`定义选项，`<checkbox>`和`<radio>`用于复选框和单选按钮。表单的属性如...
- `<form>`用于创建表单，`<input>`定义输入字段，type属性可以是text、password、checkbox、radio等。 - `<textarea>`定义多行文本输入，`<select>`定义下拉列表，`<option>`定义选项。 - `<label>`定义标签，与...
- 通过CSS属性选择器（`[attr=value]`）可以针对特定属性值的元素设置样式，例如：`input[type="checkbox"]`。 4. 响应式设计： - 使用媒体查询（`@media screen and (max-width: XXXpx)`）实现不同屏幕尺寸下的...
需要注意的是，在删除过程中，表格的行数会动态减少，因此在循环删除多行时需要特别注意索引的变化。 ```javascript function removeAllRow() { var objTable = document.getElementById("myTable"); var ...
- **多行文本框**：`<textarea>`用于输入多行文本。 通过上述内容，我们不仅了解了HTML的基本结构和元素，还深入探讨了如何使用HTML来构建复杂的网页结构，包括表格和表单的设计。这些基础知识对于前端开发来说至...
- `<del>`：删除线文本。 **3.2 字体设置** - `<font>`标签可用于更改字体、大小和颜色。 ```html <font face="Arial" size="5" color="#FF0000">Hello World! ``` #### 四、建立列表 **4.1 无序列表 `<ul>`...
2.2 动态添加，修改，删除下拉框中的元素 2.3 可以输入内容的下拉框 2.4 多行文本框中只能输入iMax文字。如果多输入了，自动减少到iMax个文字（多用于短信发送) 3、打印类 3.1 打印控件 4、事件类 4.1 屏蔽...
* 删除线：删除线</strike>` 定义删除线文本 * 上下标：下标</sub>`、上标</sup>` 定义上下标文本 * 大小字体：大字体文本</big>`、小字体文本</small>` 定义大、小字体文本 字符实体 字符实体用于显示特殊字符。 ...