JavaScript表錯誤結果

我正在嘗試爲12音調音樂創建一個矩陣。 0-11之間的數字顯示間距之間的間隔。JavaScript表錯誤結果

我的腳本正確地顯示矩陣，因爲它最初與頁面一起運行;但是當我們用按鈕進行另一次計算時，即使採用相同的音高設置，也會變得混亂。

這裏是我的腳本：

var exist = 0; 

function execute (form) { 
    therow = form.inputbox.value.split(","); 
    matrix(); 
} 


function shufflerow (form) { 

    shuffle = function(v){ 
     for (var y, x, z = v.length; z; y = parseInt(Math.random() * z), x = v[--z], v[z] = v[y], v[y] = x); 
     return v; 
    } 

    var randomrow = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]; 

    shuffle(randomrow); 
    var newLength = randomrow.unshift(0); 
    form.inputbox.value = randomrow; 
} 


function matrix() { 


    if (exist > 0) { 
     var box = document.getElementById('matrixarea'); 
     var table = document.getElementById('matrixbox'); 
     box.removeChild(table); 
    } 


    if (typeof(therow) == 'undefined') { 
     therow = new Array (0,3,2,1,9,5,7,6,8,4,11,10); 
    } 


    var body = document.getElementsByTagName("body")[0]; 
    var tbl = document.createElement("table"); 
    var tblBody = document.createElement("tbody"); 
    var row = document.createElement("tr"); 

    for(h=0 ; h < 12 ; ++h) { 
     var cell = document.createElement("td"); 
     var cellText = document.createTextNode(therow[h]); 
     cell.appendChild(cellText); 
     row.appendChild(cell); 
    } 

    rows = new Array(11); 

    for (i=1 ; i < 12 ; ++i) { 
     tblBody.appendChild(row); 
     var row = document.createElement("tr"); 
     col = new Array(11); 
     col[i] = 12 - therow[i]; 

     var cell = document.createElement("td"); 
     var cellText = document.createTextNode(col[i]); 
     cell.appendChild(cellText); 
     row.appendChild(cell); 
     tblBody.appendChild(row); 

     rows[i] = new Array(11); 

     for (j=1 ; j < 12 ; ++j) { 
      rows[i][j] = (col[i] + therow[j]) % 12; 

      var cell = document.createElement("td"); 
      var cellText = document.createTextNode(rows[i][j]); 
      cell.appendChild(cellText); 
      row.appendChild(cell); 
     } 
    } 

    tblBody.appendChild(row); 
    tbl.appendChild(tblBody); 
    body.appendChild(tbl); 

    tbl.setAttribute('id','matrixbox'); 
    tbl.setAttribute("cellpadding", "5"); 
    tbl.setAttribute("cellspacing", "0"); 

    document.getElementById('matrixarea').appendChild(tbl); 

    exist++; 

}

這裏是形式：

<div id="matrixarea"> 

    <form name="primerow" action="" method="get"> 
     <input type="text" name="inputbox" value=""> 
     <input type="button" name="button2" value="Shuffle" onClick="shufflerow(this.form)"> 
     <input type="button" name="button1" value="Make" onClick="execute(this.form)"> 
    </form> 

</div>

你可以看到它在行動@http://abbasmacioglu.home.anadolu.edu.tr/m.html。

在一個正確的矩陣中，第一個數字應該從桌面上的對角線上看，從左上角到右下角。

我會很感激任何幫助或意見。

來源

2009-10-07 buba

therow =新陣列（0,3,2,1,9,5,7,6,8,4,11,10）

這是數量的陣列。

therow = form.inputbox.value.split（「，」）;

這是一個String數組。

然後您嘗試對字符串進行算術運算。 '2'+'3'='23'不是'5'，所以你會得到意想不到的結果。

for (var i= therow.length; i-->0;) 
    therow[i]= +therow[i]; // convert to Number

此外矩陣（）似乎要複雜得多。如何：

function matrix(row) { 
    var table= document.getElementById('matrixbox'); 
    if (table) 
     table.parentNode.removeChild(table); 
    table= document.createElement('table'); 
    table.id= 'matrixbox'; 

    for (var i= 0; i<row.length; i++) { 
     var tr= table.insertRow(i); 
     for (var j= 0; j<row.length; j++) { 
      // this is the actual calculation here 
      var value= (row[j]-row[i] +row.length)%row.length; 
      tr.insertCell(j).appendChild(document.createTextNode(value)); 
     } 
    } 

    document.getElementById('matrixarea').appendChild(table); 
}

然後，擺脫那個討厭therow全球，通話使用：

<body onload="matrix([0,3,2,1,9,5,7,6,8,4,11,10])">

和：

function execute(form) { 
    var row= form.elements.inputbox.value.split(','); 
    for (var i= row.length; i-->0;) 
     row[i]= +row[i]; 
    matrix(row); 
}

作爲獎勵，會爲任何行長度工作。（忘記cellpadding/cellspacing;通過CSS設置'padding'和'border-spacing'），並且不要在HTML元素上使用setAttribute（），因爲它在IE中有bug，而且它很醜陋）。

來源

2009-10-07 11:07:31 bobince

就是這樣，非常感謝你。順便說一句，我無法運行你的矩陣函數，根本沒有表，我想念什麼？謝謝你的其他建議，我非常感謝你的幫助。 – buba 2009-10-07 17:56:40

適合我，你只需要確保在上面的onload中打電話。 – bobince 2009-10-07 20:03:30

http：// debuggable。com/posts/7 + 8 === 7-in-javascript：4acba016-d204-489b-b5a0-1fd0cbdd56cb – powtac 2009-10-07 20:08:39

我發現字符串數組另一種解決方案，我不知道是否有與bobince的方式顯著差異：

 for (i=0; i<therow.length; i++) { 
    therow[i] = parseInt(therow[i]); 
}

來源

2009-10-07 22:01:19 buba

JavaScript表錯誤結果

回答

相關問題