我能否在JavaScript中拆分预分割的字符串?

3

嗨,我有一个技术测试需要将180个字符分成6组,并将它们放在6个表格中。

几天前,在这里得到的帮助已经让我成功地分割了这些字符,但我意识到我需要再次分割新形成的数组;因为一旦这6个表格被创建,这6组就只会记录在第一个表格的顶行。

我需要将这些组成对日志记录在9列x 3行的表格中,但似乎做不到。这是我的代码:

 <script>

 var ticketString ="011722475204365360702637497481233455758302154058881928446789061241507324334876840738576186051132437816395663800818206590104559628214294664710935667287132130687703253151692742547985".match(/.{1,2}/g);

 function loadTickets () {

 var ticket = [];

 for (var i = 0; i < ticketString.length / 15; i++) {

     ticket[i] = ticketString.slice(i * 15, (i + 1) * 15).sort();

     var table = document.createElement("TABLE")

     table.border='1'

     table.setAttribute("id","ticketTable" + i)

     var tableBody = document.createElement("TBODY")

          tableBody.setAttribute("id","ticketBody")

          table.appendChild(tableBody); 

                 for (b=0;b<=2;b++) {

                 var row = document.createElement("TR")

                 row.setAttribute("id", "ticketRow" + b)

                 tableBody.appendChild(row)

                     for (c=0; c<=8;c++) {

                     var cell = document.createElement("TD")

                     cell.setAttribute("id","ticket-number" + c)

                     cell.bgColor = 'red';

                     row.appendChild(cell)

                     document.body.appendChild(table)

                      document.getElementById('ticket-number' + i).innerHTML = ticket[i];


     }

 }

 }

 console.log(tableBody);

 console.log(row);

 console.log(cell);

 };

 </script>

你为什么要在循环中将表格附加到主体中? - Shaun
这并没有太多意义。在循环中,您将票号+i设置为ticket[i],i、b和c - 您实际上从未使用这些变量,除了用于ID。无论如何,这都与奇数有关。 - Shaun
抱歉,我是Javascript的新手 - append是用来将表格附加到某个地方的,使用b和c是为了避免与使用i的变量冲突 - 所以这是不正确的吗?我可以轻松修改这些。票号+i是为了确保票据单元格会随着6个数组的增加而增加。 - Ben
抱歉,我也很难理解你的意图。您能提供一些东西(图片、链接)来展示所需的结果吗? - hurrtz
嗨,这是我想要实现的目标:http://bensegni.co.uk/result.png - Ben
1个回答

1
我不确定您如何确定空框,但这是6个表格,每个表格有3行,每行有5个数字,就像您的图片一样。它实际上执行以下操作:
  1. 将字符串分割成18个数组,每个数组包含5个数字。
  2. 创建一个多维数组,其中包含3个在#1中创建的数组。
  3. 根据算法检查每个位置,确定该数字是否属于该索引。
  4. 为每个外部数组创建一个表格,在该表格内部的每个内部数组中创建一行,并为该表格内的每个行中的每个数字创建一列。

在视觉上,您可以将其想象为堆叠多维数组。

 var ticketString = "011722475204365360702637497481233455758302154058881928446789061241507324334876840738576186051132437816395663800818206590104559628214294664710935667287132130687703253151692742547985".match(/.{1,2}/g);

 function loadTickets() {
     var ticketTables = [];
     var ticketGroups = [];
     var numberOfNumbers = 5; // per row
     var inc = 0;
     for (var i = 0; i < ticketString.length / numberOfNumbers; i++) {
         var start = i * numberOfNumbers;
         var end = start + numberOfNumbers;
         ticketGroups[i] = ticketString.slice(start, end);

         ticketTables[inc] = ticketTables[inc] || [];
         ticketTables[inc].push(ticketGroups[i]);

         if ((i + 1) % 3 === 0) {
             inc += 1;
         }
     }

     for (var i = 0, max = ticketTables.length; i < max; i += 1) {
         var table = ticketTables[i];
         for (var j = 0, jmax = table.length; j < jmax; j += 1) {
             var row = table[j];
             var newRow = [];
             for (var k = 0, kmax = 9; k < kmax; k += 1) {
                 newRow[k] = '';
                 for (var l = 0, lmax = row.length; l < lmax; l += 1) {
                     var number = parseInt(row[l]);

                     if (number >= (k) * 10 && number < (k + 1) * 10) {
                         newRow[k] = number;
                     }

                     if (number >= (kmax * 10) && k === kmax - 1) {
                         newRow[k] = number
                     }
                 }

             }
             ticketTables[i][j] = newRow;

         }
     }

     console.log(ticketTables);

     for (var i = 0, max = ticketTables.length; i < max; i += 1) {
         var table = ticketTables[i];
         var $table = document.createElement('table');
         for (var j = 0, jmax = ticketTables[i].length; j < jmax; j += 1) {
             var row = table[j];
             var $row = document.createElement('tr');
             $table.appendChild($row);

             for (var k = 0, kmax = row.length; k < kmax; k += 1) {
                 var cell = row[k];
                 var $cell = document.createElement('td');
                 $row.appendChild($cell);
                 $cell.innerHTML = cell;
             }

         }
         document.body.appendChild($table);
     }
 };

 loadTickets();
input {
    width: 100%;
}
table, tr, td {
    border: 1px solid grey;
}
table tr td {
    min-width: 20px;
}


欢迎,@Ben。如果您需要额外的指导,当然可以留下评论或者我可以开始一次聊天。同时,如果这个回答有帮助的话,请随意选择它作为正确的答案。 - Tomanow
我只是在给我的笔记本充电,但我会的。我真的不知道应该如何将数字放置在随机位置,就像图片所示。 - Ben
我实际上看到了一个模式,我会更新空白框的答案 :) - Tomanow
嗨@Tomanow - 它运行得非常好!你介意我研究代码并对代码进行评论,因为我需要完全理解它,而且有一些元素我不确定 - 例如我从未使用过的算法,我真的想了解代码正在做什么,这样,我将来会取得更好的进展。最后,非常感谢您的帮助!我很感激您所花费的所有时间和精力。 :) - Ben
让我们在聊天中继续这个讨论。点击此处进入聊天室 - Ben
显示剩余4条评论

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接