JavaScript中循環的奇怪行爲

-1

我有一個帶有文本輸入的表格式結構，其中我試圖將整行與所有子項一起刪除，但首先將單元格的值逐個向上傳遞在下面的行中保留ID編號結構。JavaScript中循環的奇怪行爲

表結構是這樣的：

<table cellpadding=0> 
    <tr id="myRow1"> 
     <td id="#R1C1"> 
      <input class="myCell"> 
     </td> 
     <td id="#R1C2"> 
      <input class="myCell"> 
     </td> 
     <td id="#R1C3"> 
      <input class="myCell"> 
     </td> 
     <td id="#R1C4"> 
      <input class="myCell"> 
     </td> 
    </tr> 
    <tr id="myRow2"> 
     <td id="#R2C1"> 
      <input class="myCell"> 
     </td> 
     <td id="#R2C2"> 
      <input class="myCell"> 
     </td> 
     <td id="#R2C3"> 
      <input class="myCell"> 
     </td> 
     <td id="#R2C4"> 
      <input class="myCell"> 
     </td> 
    </tr> 
    <!-- ...and so on. --> 
</table>

有了這個表，當觸發一些事件，我有這樣的代碼運行：

var rows = 1; // This value is updated when adding/removing a line 

//This code runs from any <tr> by event keyup 
if (event.altKey) { // I define here all Alt+someKey actions. 
    // Getting position values 
    var currentId = $(this).attr('id'); 
    var row = Number(currentId.split('C')[0].substring(1)); 
    var column = Number(currentId.split('C')[1]); 
    var belowVal; 

    if (event.which == 66) { //Case Ctrl+B 
     // If not the last row, start looping 
     if (rows > row) { 
      var diff = rows - row; 
      // Iteration over rows below 
      for (var i = 0; i < diff; i++) { 
       // Iteration over each column 
       for (var c = 1; c <= 4; c++) { 
        // here I try to get the value from column below 
        belowVal = $('#R'+(row+1+i).toString() + 
           'C'+c.toString()).val(); 
        $('#R'+(row+i).toString()+'C' + 
          c.toString()).find('.myCell').val(belowVal); 
       } 
      } 
     } 
     $('#myRow'+rows.toString()).empty(); 
     $('#myRow'+rows.toString()).remove(); 
     rows--; 
    } 
}

它工作正常除去最後一排，但是，當試圖刪除上一行時，當前行和下面的行的值變爲空白而不是向上移動。我爲下面的每一行創建了這段代碼，將它的值傳遞給上一行，但它沒有做我想做的。

這是爲什麼發生？我想不起來。

來源

2014-09-10 SebasSBM

也許你只是不應該使用這樣一個id結構？這似乎很無用。大概是 – Bergi 2014-09-10 19:39:43

。這是一個簡單的例子。網絡應用程序有更多的功能，這只是其中之一。我需要IDs結構來使函數能夠通過箭頭鍵和其他東西移動。 – SebasSBM 2014-09-10 19:41:15

我的意思是我不認爲你需要他們。有比IDS更容易識別表格單元格的方法，這種方法不需要跟蹤和更新任何屬性。 – Bergi 2014-09-10 19:47:40

問題似乎是，您用於訪問值的ID不是輸入元素的ID，而是包含表格單元格的ID。

這裏的方法，其犯規使用ID，但依賴於節點的結構，而不是，代碼沒有測試：

if (event.which == 66) { 
    var currentrow = $(this); 
    var currentinputs = currentrow.find('input.myCell'); 
    while(var nextrow = currentrow.next('tr')) { 
     var nextinputs = nextrow.find('input.myCell'); 
     currentinputs.each(function(index,element){ 
      element.val(nextinputs.get(index).val()); 
     }); 
     currentrow = nextrow; 
     currentinputs = nextinputs; 
    } 
    currentrow.remove(); 
}

來源

2014-09-10 20:10:46 JHoffmann

對不起，我的代碼是從觸發的，而不是從 ^^' – SebasSBM 2014-09-10 20:12:50

@SebasSBM在''belowVal = .val（）'我打電話。 – JHoffmann 2014-09-10 20:16:16

Jeez，我沒有注意到！： - $謝謝 – SebasSBM 2014-09-10 20:19:03

議決

感謝@JHoffmann，我能解決我的問題是這樣的：

for (var c = 1; c <= 4; c++) { 
    // here I try to get the value from column below 
    belowVal = $('#R'+(row+1+i).toString()+'C'+c.toString()) 
       .find('.myCell').val(); 
    $('#R'+(row+i).toString()+'C'+c.toString()) 
       .find('.myCell').val(belowVal); 
}

在這種分配值belowVal行了，我忘了打電話日在調用.val()之前調用方法.find('.myCell')。這是錯誤導致我的代碼失敗，因爲@J霍夫曼在他的回答中評論道。

來源

2015-12-08 15:02:07 SebasSBM

JavaScript中循環的奇怪行爲

回答

相關問題