for循环-带有for的Javascript表

for loop - Javascript table with for

本文关键字：for Javascript 带有 循环      更新时间：2023-09-26

我是Javascript的新手，一整天都在尝试一个带有for循环的Javascript表。我想得到一个单元格的值。我正在做一个"Excel应用程序"。请检查出了什么问题。我只是在回答中修正了一些问题。。。。

var MatriXcel = ( function( window, undefined ) {
  var matriz = [];
  var matrizJson;
  var row = 5;
  var col = 6;
  function getData(){
    return matriz;
  }
  function addRow(){
    var newCol = [];
    for (var i=0; i < col; i++){
        newCol.push("");
    }
      matriz.push(newCol);
      this.draw();
    }
   function drawTable(){
    var table = "<tr><th></th><th>A</th><th>B</th><th>C</th><th>D</th><th>E</th></tr>";
    for (var i=0; i < matriz.length; i++){
      table += "<tr>";
      for (var x=0; x < matriz[i].length; x++){
        if (x == 0){
          table += "<th>"+(i+1)+"</th>";
        }else{
        table += "<td><input type='text' onkeyup='MatriXcel.save("+i+","+x+",this)' value='"+matriz[i][x]+"'></td>";
        }
      }
      table += "</tr>";
   }
   document.getElementById("tabla").innerHTML = table;
   }
   function saveInfo(irow, xcol, content){
    matriz[irow][xcol] = content.value;
  }
   function getMatch(){
    var tabla = document.getElementById("tabla");
    search= document.getElementById("word").value;
    var re = new RegExp(search,"gi");
    var row;
    var col;
    for (var i = 0; i< tabla.rows.length; i++){
        row = tabla.rows[i];
            for (var j; j<row.cells.length; j++){
                col = row.cells[j];
                 if(re.test(row.textContent)){
                     row.style.color="rgb(239, 19, 109)";
                    alert(row.textContent);
                }else if(re.test(col.textContent)){
                  col.style.color="rgb(79, 2, 133)";
                 }
            }
    }
    }
  function saveLocal(){
    matrizJson = JSON.stringify(matriz);
    console.log(matrizJson);
    window.localStorage.table = matrizJson;
    // matrizJson = JSON.parse(matrizJson);
    // console.log(matrizJson);
  }
  function init(){
    if(typeof window.localStorage.table === 'string'){
      matriz = JSON.parse(window.localStorage.table);
      this.draw();
    }
  }
  return {
    addRow : addRow,
    draw : drawTable,
    save : saveInfo,
    get : getData,
    local : saveLocal,
    init : init,
    search : getMatch,
  };
} )( window );
if (window.localStorage.length == 0){
  MatriXcel.addRow();
  MatriXcel.addRow();
  MatriXcel.addRow();
  MatriXcel.addRow();
  MatriXcel.addRow();
}else{
  MatriXcel.init();
}
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>ExcelApp</title>
  <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
  <input type="search" value="" placeholder="write here" id="word">
  <input type="button" value="Search" id="trigger" onclick="MatriXcel.search()">
  <table id="tabla">
  </table>
</body>
<script type="text/javascript" src="script.js"></script>
</html>

检查正则表达式的方法似乎有问题。

例如，代替这个

if(re == row.value){

应该是

if(re.test(row.value)){

此外，请按照@Teemu在评论中的建议更新代码

你必须检查col.textContent或col.innerHTML，而不是row.value

相关文章：