2014-08-28 83 views
0

我已經做了一個循環到動態錶行中的幾個字段來寫入和從本地存儲檢索數據。javascript循環不寫入數字輸入

它首先將數據保存在localstore上,將表重置爲0行並用於檢索數據,表格行將被重新創建並在那裏加載數據。問題是當文本框是「數字」類型時,該字段顯示爲空白。當我在數字字段的佔位符值上嘗試它時,它會在各個字段上加載數據,以便查看數據。

這隻發生在表的動態行中的循環字段上。來自固定行的數字輸入可以正確加載。

該ID的我在那裏循環使用正確和版畫

document.getElementById('4-4-1').value = 2"

4-4-1 = x-y-z 
x = tableNumber 
y = FieldNumber 
z = RowNumber 

但是,當我在控制檯上再次粘貼document.getElementById('4-4-1').value,它沒有返回。 (雖然字段中出現佔位符「2」)。

我也試着改變控制檯中同一行的值,它能正常工作。

爲什麼它在循環過程中不在數字字段上工作?

在Chrome,Firefox上試用過。瞄準Android 4.2網絡視圖。

的商店循環

function saveRecordNow() { 
var rec = {}; 
rec[0] = document.getElementById('data0').value 
rec[1] = document.getElementById('data1').value 
rec[2] = document.getElementById('otherdata').value 
rec[3] = document.getElementById('foo').value 
... 
... 
var tblSpaceQtr = document.getElementById('tblSpaceQtr'); 

rowCnt = tblSpaceQtr.getElementsByTagName("tr").length - 11; 
//there are 11 fixed rows on the table, and is not included on the count 


//var page4Data = ''; 
for(x=1; x <= rowCnt; x++) { 
    page4Data += document.getElementById("4-1-"+x).value + ', '+ 
    document.getElementById("4-2-"+x).value + ', '+ 
    document.getElementById("4-3-"+x).value + ', '+ 
    document.getElementById("4-4-"+x).value + ', '+ 
    document.getElementById("4-5-"+x).value + ', '+ 
    document.getElementById("4-6-"+x).value + ', '+ 
    document.getElementById("4-7-"+x).value + ', '+ 
    document.getElementById("4-8-"+x).value + ', '+ 
    document.getElementById("4-9-"+x).value + ', '+ 
    document.getElementById("4-10-"+x).value + ', '+ 
    document.getElementById("4-11-"+x).value + ', '+ 
    document.getElementById("4-12-"+x).value + ', '+ 
    document.getElementById("4-13-"+x).value + ', '+ 
    document.getElementById("4-14-"+x).value + ', '+ 
    document.getElementById("4-15-"+x).value + ', '+ 
    document.getElementById("4-16-"+x).value + ', '+ 
    document.getElementById("4-17-"+x).value + ', '+ 
    document.getElementById("4-18-"+x).value + ', '+ 
    document.getElementById("4-19-"+x).value + ', '+ 
    document.getElementById("4-20-"+x).value + ', '+ 
    document.getElementById("4-21-"+x).value + ', '+ 
    document.getElementById("4-22-"+x).value + ', '+ 
    document.getElementById("4-23-"+x).value + '||| '; 
    //console.log("data from 4-1-"+x); 
} 
page4Data.substring(0, page4Data.length - 2); //remove end comma 
//alert() 
rec[681] = page4Data; 

... 
} 

的檢索循環

function loadRecord(n) { 

var getVar = JSON.parse(localStorage.getItem(n)); 
document.getElementById('id').value = n; 
numCells = document.getElementById('nbcells'); 

document.getElementById('data0').value = getVar[0]; 
document.getElementById('data1').value = getVar[1]; 
document.getElementById('otherdata').value = getVar[2]; 
document.getElementById('foo').value = getVar[3]; 
document.getElementById('foo2').value = getVar[4]; 
document.getElementById('foo3').value = getVar[5]; 
... 

initTable(numCells, numCells.value) 
var pg4Data = [], 
pg4RowData = [], 
pg4Data = getVar[681].split('|||'); 
page4Data = getVar[681] 
//getVar[681] from JSON.parse(localStore['source']); 
//having a csv separated by '|||' per row 

for(x=1; x < pg4Data.length; x++) { 
    pg4RowData = pg4Data[x-1].split(','); 
    document.getElementById("4-1-"+x).value = pg4RowData[0];  
    document.getElementById("4-2-"+x).value = pg4RowData[1]; 
    document.getElementById("4-3-"+x).value = pg4RowData[2]; 
    document.getElementById("4-4-"+x).value = pg4RowData[3]; 
    console.log("document.getElementById('4-4-"+x+"').value =" +pg4RowData[3]); 
     document.getElementById("4-4-"+x).placeholder = pg4RowData[3]; 
    //document.getElementById("4-4-"+x).setAttribute('value', pg4RowData[3]); 
    //document.getElementById("4-5-"+x).value = pg4RowData[4]; 
    document.getElementById("4-5-"+x).value = pg4RowData[4]; 
     document.getElementById("4-5-"+x).placeholder = pg4RowData[4]; 
    document.getElementById("4-6-"+x).value = pg4RowData[5]; 
     document.getElementById("4-6-"+x).placeholder = pg4RowData[5]; 
    document.getElementById("4-7-"+x).value = pg4RowData[6]; 
     document.getElementById("4-7-"+x).placeholder = pg4RowData[6]; 
    document.getElementById("4-8-"+x).value = pg4RowData[7]; 
     document.getElementById("4-8-"+x).placeholder = pg4RowData[7]; 
    document.getElementById("4-9-"+x).value = pg4RowData[8]; 
     document.getElementById("4-9-"+x).placeholder = pg4RowData[8]; 
    document.getElementById("4-10-"+x).value = pg4RowData[9]; 
    document.getElementById("4-11-"+x).value = pg4RowData[10]; 
    document.getElementById("4-12-"+x).value = pg4RowData[11]; 
    document.getElementById("4-13-"+x).value = pg4RowData[12]; 
    document.getElementById("4-14-"+x).value = pg4RowData[13]; 
    document.getElementById("4-15-"+x).value = pg4RowData[14]; 
    document.getElementById("4-16-"+x).value = pg4RowData[15]; 
    document.getElementById("4-17-"+x).value = pg4RowData[16]; 
    document.getElementById("4-18-"+x).value = pg4RowData[17]; 
    document.getElementById("4-19-"+x).value = pg4RowData[18]; 
    document.getElementById("4-20-"+x).value = pg4RowData[19]; 
    document.getElementById("4-21-"+x).value = pg4RowData[20]; 
    document.getElementById("4-22-"+x).value = pg4RowData[21]; 
    document.getElementById("4-23-"+x).value = pg4RowData[22]; 
} 
... 
} 
+2

請創建一個完全演示問題的簡化測試用例。它需要包含一些HTML和加載腳本的機制。 JSBin或JSFiddle的現場示例會很有幫助。 – Quentin 2014-08-28 08:30:22

+2

只需提醒HTML4:'ID和NAME標記必須以字母([A-Za-z])開頭,後面可以跟隨任意數量的字母,數字([0-9]),連字符(「 - 」 ),下劃線(「_」),冒號(「:」)和句點(「。」)。 – DoXicK 2014-08-28 08:32:59

+0

pg4RowData不是你期望的那樣嗎? – GuardianX 2014-08-28 09:00:10

回答

0

元素的標識,類名,並在JavaScript 變量不能以數字開始!請在字符前加上值,然後重試。

for(x=1; x < pg4Data.length; x++) { 
    pg4RowData = pg4Data[x-1].split(','); 
    document.getElementById("s-4-1-"+x).value = pg4RowData[0];  
    document.getElementById("s-4-2-"+x).value = pg4RowData[1]; 
    document.getElementById("s-4-3-"+x).value = pg4RowData[2]; 
    document.getElementById("s-4-4-"+x).value = pg4RowData[3]; 
+0

嗨@Praveen,我試着像'document.getElementById(「row4-1 - 」+ x)''這樣做,但在瀏覽器上不行。我在chrome控制檯上執行了這個命令,它改變了這個值,所以我仍然認爲這是循環。當字段創建並且工作時,我也嘗試將字段類型更改爲「文本」。同時,我會嘗試做一個JSFiddle。謝謝大家回覆 – niCad 2014-08-28 08:53:11

+0

@niCad是的,做一個jsFiddle將是一個好主意。我正在等待小提琴,以便我們檢查出什麼問題! – 2014-08-28 08:53:51