`
后山
  • 浏览: 18167 次
最近访客 更多访客>>
社区版块
存档分类
最新评论

JS: dynamic table deleteRow

    博客分类:
  • JS
阅读更多
js 代码
  1. <script type="text/javascript" src="prototype.js"></script>
  2. <script type="&lt;span" class="string">"text/javascript">
  3. function del(e,obj,id) {
  4. var rowIndex;
  5. if (!e) {
  6. e = window.event; // IE
  7. rowIndex = event.srcElement.parentElement.parentElement.sectionRowIndex;
  8. } else {
  9. rowIndex =obj.parentNode.sectionRowIndex; // DOM Level 2
  10. }
  11. $('peopleTable').deleteRow(rowIndex);
  12. }
  13. </script>
java 代码
 
  1. table  
  2. tbody id='peopleTable'  
  3. tr  
  4. td  
  5. a href="#" onClick="javascript:del(event,this.parentNode,DB_ID)">Del  




  1. 注:使用href,则必须调用onclick方法,否则无法取得parentElement.
分享到:
评论

相关推荐

    js 删除动态创建的行

    var table = document.getElementById('dynamicTable'); var tbody = table.tBodies[0]; var rowCount = tbody.rows.length; var row = tbody.insertRow(); row.id = 'row' + rowCount; // 添加行号 var ...

    js应用之动态增加,删除一行

    &lt;table id="dynamicTable"&gt; 姓名 年龄 操作 &lt;td&gt;&lt;input type="text"&gt; &lt;td&gt;&lt;input type="number"&gt; &lt;td&gt;&lt;button class="deleteRow"&gt;删除&lt;/button&gt;&lt;/td&gt; &lt;/table&gt; ``` 接着,我们通过JavaScript来处理...

    jQuery自定义添加删除表单代码.zip

    #dynamicTable td, #dynamicTable th { border: 1px solid #ddd; padding: 8px; } #dynamicTable tr:nth-child(even) { background-color: #f2f2f2; } ``` 现在,我们进入jQuery部分。首先,我们需要在文档加载...

    动态表格-添加删除行

    var table = document.getElementById('dynamicTable'); var newRow = table.insertRow(-1); for (var i = 0; i &lt; table.rows[0].cells.length; i++) { var cell = newRow.insertCell(i); cell.innerHTML = '新...

    js动态构建可以置顶、置底、上移、下移

    &lt;table id="dynamicTable"&gt; 列1 列2 操作 &lt;/table&gt; 添加行 置顶 置底 上移 下移 &lt;button id="deleteRow"&gt;删除行 ``` 接下来,我们使用JavaScript(这里假设使用了ES6语法)来处理这些操作: 1. **...

    jquery入门之动态表格---动态添加删除一行

    &lt;tbody id="dynamicTable"&gt; &lt;/table&gt; ``` 为每一行生成时添加删除按钮: ```javascript function createRow(data1, data2) { var newRow = $("&lt;tr&gt;&lt;td&gt;" + data1 + "&lt;/td&gt;&lt;td&gt;" + data2 + "&lt;/td&gt;&lt;td&gt;...

    动态添加/删除表格行并提交内容到后台

    &lt;table id="dynamicTable"&gt; 内容 &lt;td&gt;&lt;button onclick="addRow()"&gt;添加&lt;/button&gt;&lt;/td&gt; &lt;td&gt;&lt;button onclick="deleteRow(this)"&gt;删除&lt;/button&gt;&lt;/td&gt; &lt;/table&gt; function addRow() { var table = document....

    CSS控制按钮显示、动态添加删除行

    var table = document.getElementById('dynamicTable'); var newRow = table.insertRow(-1); var cell1 = newRow.insertCell(0); var cell2 = newRow.insertCell(1); var cell3 = newRow.insertCell(2); cell1...

    javascript动态行(代码清晰易懂)

    在`dynamicTable`文件中,你可能找到了示例代码,包括上述功能的实现。分析和理解这些代码将有助于你在实际项目中实现类似的功能。记得在使用前进行测试,确保代码在不同浏览器和设备上的兼容性。通过不断实践和优化...

    jQuery实现动态增加行,发送Ajax请求返回HTML

    &lt;table id="dynamicTable"&gt; &lt;td&gt;&lt;input type="text" name="field1"&gt; &lt;td&gt;&lt;input type="text" name="field2"&gt; &lt;td&gt;&lt;button class="addRow"&gt;添加行&lt;/button&gt;&lt;/td&gt; &lt;/table&gt; ``` 2. **jQuery绑定事件**:...

    Javascript动态创建表格及删除行列的方法

    myTable.id = "DynamicTable"; // 设置表格ID var myRow = document.getElementById("myRow").value; // 获取用户输入的行数 var myCol = document.getElementById("myCol").value; // 获取用户输入的列数 // ...

    HTML和JavaScript的常用功能

    4. **DHTML创建Table(2).html** - DHTML(Dynamic HTML)是指动态HTML,通过JavaScript和CSS实现页面内容的实时更新。创建表格可以通过`&lt;table&gt;`元素和JavaScript的DOM操作实现,例如,`document.createElement('...

    DHTML实现表格的增加和删除

    table.deleteRow(this.parentNode.rowIndex); } } ``` **压缩包中的文件“testDHTML.htm”** 这个文件很可能是博主提供的一个示例,包含了一个简单的HTML页面,其中实现了DHTML表格增删功能。通过打开这个文件,...

    038HTML-DOM对象.doc

    在这个文档中,主要讨论了HTML DOM中的Table对象及其相关对象,以及DHTML(Dynamic HTML)中的其他对象。 1. HTML DOM 对象 Table对象代表HTML中的表格元素`&lt;table&gt;`。它有几个重要的属性和方法: - `cells`属性...

Global site tag (gtag.js) - Google Analytics