js 、jquery遍历表格遇到的问题

这两天用脚本语言遍历表格的时候遇到那么一个问题，我本来希望如果我新加入的数值，与表格中的数值一致，就禁止他加入，弹出提示。

用jquery的each方法遍历的话，很容易实现，可是，问题是，这个是闭包环境，弹出提示后，后面的代码仍然执行。

为了解决这个问题只能用js脚本的for语句遍历表格了。

现在把两种遍历方式都放这里了

jquery遍历表格：

$("#tbList label").each(function(){

var thisObj = this.parentNode.parentNode;

var tds = $(thisObj).children(); //所有列

if($('#wareId').val()==tds.eq(3).text()&&$('#vendorCode').val()==tds.eq(1).text())

{

alert("该数据已加入下方列表，请勿重复加入。");

return false;

}

});

js遍历表格：

var objTable=document.getElementById("tbList");

if(objTable)

{

for(var i=0;i<objTable.rows.length;i++)

{

if($('#wareId').val()==objTable.rows[i].cells[3].firstChild.nodeValue&&$('#vendorCode').val()==objTable.rows[i].cells[1].firstChild.nodeValue)

{

alert("该数据已加入下方列表，请勿重复加入。");

return false;

}

}

}

转一篇其他js操作表格的函数集合：

一组JS创建和操作表格的函数集合

一组JS创建和操作表格的函数集合

在用AJAX的时候，经常要用JS操作DOM，当涉及到数据列表的时候，那用表格比较多，这里写了组函数集合，专门用来操作表格，当然，目前还有很多不足，但是对一些简单操作还是很方便的。

//隐藏列

function setHiddenRow(tb,iCol){

for (i=0;i<oTable.rows.length;i++){

tb.rows[i].cells[iCol].style.display = oTable.rows[i].cells[iCol].style.display=="none"?"block":"none";

}

}

//隐藏行

function setHiddenRow(tb,iRow){

tb.rows[iRow].style.display = oTable.rows[iRow].style.display == "none"?"block":"none";

}

//创建表格

function createTable(id,rows,cells,tbid){

var tb=document.createElement("table");

var tbody = document.createElement("tbody");

for(var i=0;i<rows;i++){

var tr=document.createElement("tr");

for(var j=0;j<cells;j++){

var cell=document.createElement("td");

tr.appendChild(cell);

}

tbody.appendChild(tr);

}

tb.appendChild(tbody);

tb.setAttribute("id",tbid);//设置创建的TABLE的ID

document.getElementById(id).appendChild(tb);

}

//插入文本

function insertText(tb,row,cel,text){

txt=document.createTextNode(text);

tb.rows[row].cells[cel].appendChild(txt);

}

//修改文本

function updateText(tb,row,cel,text){

tb.rows[row].cells[cel].firstChild.nodeValue=text;

}

//添加子节点

function toAppendChild(tb,row,cel,child){

tb.rows[row].cells[cel].appendChild(child);

}

//删除某行

function removeRow(tb,row){

tb.lastChild.removeChild(tb.rows[row]);

}

//单元格设置属性

function cellSetAttribute(tb,row,col,attributeName,attributeValue){

tb.rows[row].cells[col].setAttribute(attributeName,attributeValue);

}

//单元格添加监听器

function cellAddListener(tb,row,cel,event,fun){

if(window.addEventListener)

{

//其它浏览器的事件代码: Mozilla, Netscape, Firefox

//添加的事件的顺序即执行顺序 //注意用 addEventListener 添加带on的事件，不用加on

// img.addEventListener('click', delRow(this), true);

tb.rows[row].cells[cel].addEventListener(event,fun, true);

}

else

{

//IE 的事件代码 在原先事件上添加 add 方法

// img.attachEvent('onclick',delRow(this));

tb.rows[row].cells[cel].attachEvent("on"+event,fun);

}

}

//新增行

function insertRow(oTable){

var tr=document.createElement("tr");

for (i=0;i<oTable.rows[0].cells.length;i++){

var td= document.createElement("td");

tr.appendChild(td);

}

oTable.lastChild.appendChild(tr);

}

//行设置属性

function rowSetAttribute(tb,row,attributeName,attributeValue){

tb.rows[row].setAttribute(attributeName,attributeValue);

}

//行添加监听器

function rowAddListener(tb,row,event,fun){

if(window.addEventListener)

{

//其它浏览器的事件代码: Mozilla, Netscape, Firefox

//添加的事件的顺序即执行顺序 //注意用 addEventListener 添加带on的事件，不用加on

// img.addEventListener('click', delRow(this), true);

tb.rows[row].addEventListener(event,fun, true);

}

else

{

//IE 的事件代码 在原先事件上添加 add 方法

// img.attachEvent('onclick',delRow(this));

tb.rows[row].attachEvent("on"+event,fun);

}

}

//新增列

function addCells(tb){

for (i=0;i<tb.rows.length;i++){

var td= document.createElement("td");

tb.rows[i].appendChild(td);

}

}

//批量修改单元格属性

function cellsSetAttribute(oTable,attributeName,attributeValue){

for (i=0;i<oTable.rows.length;i++){

for (j=0;j<oTable.rows[i].cells.length;j++){

oTable.rows[i].cells[j].setAttribute(attributeName,attributeValue);

}

}

}

//合并只支持单向合并

//行合并

function mergerRow(tb,row,cell,num){

for(var i= (row+1),j=0;j<(num-1);j++){

tb.rows[i].removeChild(tb.rows[i].cells[cell]);

}

tb.rows[row].cells[cell].setAttribute("rowspan",num);

// document.getElementById('c').innerHTML=document.getElementById('u').innerHTML;

}

//列合并

function mergerCell(tb,row,cell,num){

for(var i= (cell+1), j=0;j<(num-1);j++){

tb.rows[row].removeChild(tb.rows[row].cells[i]);

}

tb.rows[row].cells[cell].setAttribute("colspan",num);

// document.getElementById('c').innerHTML=document.getElementById('u').innerHTML;

}

测试DEMO

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title> new document </title>

<meta name="generator" content="editplus" />

<meta name="author" content="" />

<meta name="keywords" content="" />

<meta name="description" content="" />

<style>

.testclass{background-color:yellow;}

</style>

<script type="text/javascript" src="stone.js"></script>

<script type="text/javascript">

<!--

function giveText(){

for(var i=0;i<5;i++){

for(var j=0;j<5;j++){

insertText(mytable,i,j,i*5+j);

}

}

}

function addInput(){

var input = document.createElement("input");

input.setAttribute("type","text");

input.setAttribute("value","我是新增的");

toAppendChild(mytable,3,3,input);

}

function listen(){

alert('恭喜你！监听器安装成功！');

}

//-->

</script>

</head>

<body>

表格函数测试<br />

<div />

</body>

</html>