Question

HTML

<table id="myList">
           <thead>
               <tr>
                   <td>Product ID</td>
                   <td>Product Name</td>
                   <td>Quantity</td>
               </tr>
           </thead>
           <tbody>

           </tbody>
       </table>

的Javascript

var tableRef = document.getElementById("myList").getElementsByTagName("tbody")[0];

       var newRow = tableRef.insertRow(tableRef.rows.length);

       var newCell = newRow.insertCell(0);

       var otherCell = newRow.insertCell(2);

       var check;
       var myText = result.text;
       var myTextTwo =  myText.replace(/['"]+/g, '');
       alert(myTextTwo);

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

           if (myTextTwo != tableRef.rows[i].cells[0].innerHTML) {
               check = true
           }
           else if (myTextTwo == tableRef.rows[i].cells[0].innerHTML) {
               tableRef.rows[i].cells[2].innerHTML += 1;
               check = false;
               break;
           }
       }

       if (check) {
           var newText = document.createTextNode(myTextTwo);
           var otherText = document.createTextNode("1");
           newCell.appendChild(newText);
           otherCell.appendChild(otherText);
       }
       else {
           alert("You have scanned this item before.");
       }

我所做的是扫描包含产品ID的QR（例如“123”），并将产品ID插入名为“产品ID”的列中，我可以这样做。

但是，我现在要做的是，如果用户扫描包含相同产品ID的QR码（例如“123”），我的代码将能够检测到副本并添加到数量上。

所以我打算做的是遍历“产品ID”列并检查是否有任何重复。如果没有任何重复项，则产品ID的数量将为1.

Product ID | Product Name | Quantity
  123      |   Hello      |     1

否则，存在重复，数量为2。

Product ID | Product Name | Quantity
  123      |   Hello      |     2

Answer 1

你的意思是这样吗？

var tableRef = document.getElementById("myList").getElementsByTagName("tbody")[0];

// save the row number of the existing product
var found = false;
var myText = result.text;
var myTextTwo = myText.replace(/['"]+/g, '');

// search the table for the existing product
for (var i = 0; i < tableRef.rows.length && !found; ++i) {
  // if you found it then
  if (tableRef.rows[i].cells[0].innerHTML == myTextTwo) {
    // update the value
    tableRef.rows[i].cells[2].innerHTML += 1;

    // and say we found it
    found = true;
  }
}

// at this point, if we didn't find anything then add a new row
if (!found) {
  var newRow = tableRef.insertRow(tableRef.rows.length);
  newRow.insertCell(0).innerText = "...";
  newRow.insertCell(0).innerText = "...";
  newRow.insertCell(0).innerText = 1;
}

<table id="myList">
  <thead>
    <tr>
      <td>Product ID</td>
      <td>Product Name</td>
      <td>Quantity</td>
    </tr>
  </thead>
  <tbody>

  </tbody>
</table>

Answer 2

我认为这可能会有所帮助：

函数duplicateCell返回给定列中包含重复项的行号，如果未找到重复项，则返回null。

函数addOne需要产品ID来检查重复项，产品名称（如果没有找到重复项，产品将需要名称，否则会被忽略）并且还需要知道哪个表到工作 AddOne使用上述函数查找重复项，并在数量上添加一个。

我开始使用1辆汽车1辆自行车和1辆滑板，增加了2辆自行车（id2）并添加了2枚火箭（id 4）。

var duplicateCell = function(tableId, columnNumber, stringToSearch) {
	var myTbody = document.getElementById(tableId).getElementsByTagName("tbody")[0];
	var tableRows = myTbody.rows.length;
	for (var i = 0; i < tableRows; i++) {
		if (myTbody.rows[i].cells[columnNumber].innerHTML.trim() == stringToSearch)
			return i
	}
	return null;
}

function addOne(productId, productName, tableId) {
	var myTbody = document.getElementById(tableId).getElementsByTagName("tbody")[0];
	var rowIndex = duplicateCell(tableId, 0, productId)
	if (rowIndex != null) {
		myTbody.rows[rowIndex].cells[2].innerHTML = +myTbody.rows[rowIndex].cells[2].innerHTML.trim() + 1;
	} else {
	var tableRows = myTbody.rows.length;
		var row = document.getElementById(tableId).insertRow();
		c1 = row.insertCell(0);
		c2 = row.insertCell(1);
		c3 = row.insertCell(2);
		c1.innerHTML = productId;
		c2.innerHTML = productName;
		c3.innerHTML = 1;
	}
}
addOne("4", "Rocket", "myList")
addOne("4", "Rocket", "myList")
addOne("2", " ", "myList")

<table id="myList">
	<thead>
		<tr>
			<td>Product ID</td>
			<td>Product Name</td>
			<td>Quantity</td>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td>1 </td>
			<td>Car </td>
			<td>1 </td>
		</tr>
		<tr>
			<td>2 </td>
			<td>Bike </td>
			<td>1 </td>
		</tr>
		<tr>
			<td>3 </td>
			<td>Skateboard </td>
			<td>1 </td>
		</tr>
	</tbody>
</table>

循环遍历我的表格的特定列

2 个答案: