<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...
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>` 定义大、小字体文本 字符实体 字符实体用于显示特殊字符。 ...