2017-02-02 48 views
0

嗨那裏我有一個問題隱藏在兩個中間單元格中具有零值的行,中間單元格上的值是從Google電子表格中動態生成的,下面的代碼很好,隱藏由我編寫的具有零值的行,但此代碼未捕獲生成的值。隱藏基於單元格值的行=零

我想要做的是在生成值後隱藏行嗎?

<html> 
<head> 
    <meta http-equiv="refresh" content="900"> 
    <link rel="stylesheet" type="text/css" href="http://www.successota.com/dp/example.css"/> 
    <script type="text/javascript" src="http://www.successota.com/dp/sortable.js"></script> 
    <script type="text/javascript" src="https://www.google.com/jsapi"></script> 
    <script type="text/javascript"> 

     // https://google,developers.appspot.com/chart/interactive/docs/spreadsheets#gid 
     google.load('visualization', '1', {packages: ['corechart', 'line']}); 
     google.setOnLoadCallback(drawChart); 

     function drawChart() { 
     // Add your sheets url and range below 

     var spreadsheetUrl = "" 
     var query = new google.visualization.Query(spreadsheetUrl); 
     query.send(handleQueryResponse); 
     } 

     function handleQueryResponse(response) { 
     var dataTable = response.getDataTable(); 
     // https://developers.google.com/chart/interactive/docs/reference?hl=en#methods 
     // getValue(rowIndex, columnIndex) 
     //document.getElementById("test").innerHTML = dataTable.getValue(0, 0); 
     // --1 --- ok 
document.getElementById("B1B").innerHTML = dataTable.getValue(0, 0); 
document.getElementById("B1S").innerHTML = dataTable.getValue(0, 1); 
document.getElementById("B2B").innerHTML = dataTable.getValue(1, 0); 
document.getElementById("B2S").innerHTML = dataTable.getValue(1, 1); 
document.getElementById("B3B").innerHTML = dataTable.getValue(2, 0); 
document.getElementById("B3S").innerHTML = dataTable.getValue(2, 1); 
document.getElementById("B4B").innerHTML = dataTable.getValue(3, 0); 
document.getElementById("B4S").innerHTML = dataTable.getValue(3, 1); 
document.getElementById("B5B").innerHTML = dataTable.getValue(4, 0); 
document.getElementById("B5S").innerHTML = dataTable.getValue(4, 1); 
document.getElementById("B6B").innerHTML = dataTable.getValue(5, 0); 
document.getElementById("B6S").innerHTML = dataTable.getValue(5, 1); 
document.getElementById("B7B").innerHTML = dataTable.getValue(6, 0); 
document.getElementById("B7S").innerHTML = dataTable.getValue(6, 1); 
document.getElementById("B8B").innerHTML = dataTable.getValue(7, 0); 
document.getElementById("B8S").innerHTML = dataTable.getValue(7, 1); 
document.getElementById("B9B").innerHTML = dataTable.getValue(8, 0); 
document.getElementById("B9S").innerHTML = dataTable.getValue(8, 1); 
document.getElementById("B10B").innerHTML = dataTable.getValue(9, 0); 
document.getElementById("B10S").innerHTML = dataTable.getValue(9, 1); 
document.getElementById("B11B").innerHTML = dataTable.getValue(10, 0); 
document.getElementById("B11S").innerHTML = dataTable.getValue(10, 1); 
document.getElementById("B12B").innerHTML = dataTable.getValue(11, 0); 
document.getElementById("B12S").innerHTML = dataTable.getValue(11, 1); 
document.getElementById("B13B").innerHTML = dataTable.getValue(12, 0); 
document.getElementById("B13S").innerHTML = dataTable.getValue(12, 1); 
document.getElementById("B14B").innerHTML = dataTable.getValue(13, 0); 
document.getElementById("B14S").innerHTML = dataTable.getValue(13, 1); 
document.getElementById("B15B").innerHTML = dataTable.getValue(14, 0); 
document.getElementById("B15S").innerHTML = dataTable.getValue(14, 1); 
document.getElementById("B16B").innerHTML = dataTable.getValue(15, 0); 
document.getElementById("B16S").innerHTML = dataTable.getValue(15, 1); 
document.getElementById("B17B").innerHTML = dataTable.getValue(16, 0); 
document.getElementById("B17S").innerHTML = dataTable.getValue(16, 1); 
document.getElementById("B18B").innerHTML = dataTable.getValue(17, 0); 
document.getElementById("B18S").innerHTML = dataTable.getValue(17, 1); 
document.getElementById("B19B").innerHTML = dataTable.getValue(18, 0); 
document.getElementById("B19S").innerHTML = dataTable.getValue(18, 1); 
document.getElementById("B20B").innerHTML = dataTable.getValue(19, 0); 
document.getElementById("B20S").innerHTML = dataTable.getValue(19, 1); 
document.getElementById("B21B").innerHTML = dataTable.getValue(20, 0); 
document.getElementById("B21S").innerHTML = dataTable.getValue(20, 1); 
     } 
    </script> 

    <script> 
    setInterval(function() { 
    var d = new Date(); 
    var seconds = d.getMinutes() * 60 + d.getSeconds(); //convet 00:00 to seconds for easier caculation 
    var fiveMin = 60 * 5; //five minutes is 300 seconds! 
    var timeleft = fiveMin - seconds % fiveMin; // let's say 01:30, then current seconds is 90, 90%300 = 90, then 300-90 = 210. That's the time left! 
    var result = parseInt(timeleft/60) + ':' + timeleft % 60; //formart seconds into 00:00 
    document.getElementById('test').innerHTML = "Time left to next 5 min update: "+result; 

}, 500) //calling it every 0.5 second to do a count down 
    </script> 
<script type="text/javascript"> 
function HideRow(){ 
//alert("Hello world"); 
var tbl = document.getElementById('TabCur');   //find the table 
var rows = tbl.querySelectorAll('tbody tr');  //find all rows in the table body 

for(i = 0; i < rows.length; i++) {     //iterate through the rows 

    var cells = rows[i].querySelectorAll('td');  //find all of the cells in the row 

    var flag = true;        //set flag prior to cell evaluation 

    for(j = 1; j < cells.length-1 ; j++) {    //iterate through the cells (starting with the cell at position 2) 
    alert(cells[j].text()); 
     if (cells[j].innerHTML != '0') {   //check if the cell contains '0' (set flag to false if cell is not '0') 
      flag = false;       
     } 
    } 

    if(flag) { 
     rows[i].classList.add('hide');    //hide the row if the falg remained true (i.e. none of the cells contained a value other than '0' 
    } 
} 
} 
</script> 
<style> 
.hide { 
    display: none; 
} 
</style>  
</head> 
<body style="background-color:#f6fbfb;a:link,a:visited,a:hover,a:active {color:#ffffff;}"> 

<div id="test" style="text-align: center;color:094f68;"></div> 
samir 
<table class="sortable" id="TabCur" style="vertical-align: top; width: 100%; height:20px; margin-left: auto; margin-right: auto; border-color:#777777;border-width: 1px;" cellspacing="2" cellpadding="2"><caption style="text-align: center;"><span style="color: #ccffff;"></span></caption> 
<thead> 
<tr style="background-color:#094f68;color:ffffff;line-height:50px"> 
<td style="text-align: center;" width="40%">A</td> 
<td style="text-align: center;" width="10%">B</td> 
<td style="text-align: center;" width="10%">C</td> 
<td style="text-align: center;" width="40%">D</td> 
</tr> 
</thead> 
<tbody> 

<tr style="background-color:#f2eab3;line-height:30px"> 
<td>Test1</td> 
<td style="text-align: center;"><p id="B2B"></p></td> 
<td style="text-align: center;"><p id="B2S"></p></td> 
<td style="text-align: right;">test1</td> 
</tr> 
<tr style="background-color:#f2eab3;line-height:30px"> 
<td>EAL</td> 
<td style="text-align: center;"><p id="B3B"></p></td> 
<td style="text-align: center;"><p id="B3S"></p></td> 
<td style="text-align: right;">Test2</td> 
</tr> 
<tr style="background-color:#f2eab3;line-height:30px"> 
<td>test3</td> 
<td style="text-align: center;"><p id="B4B"></p></td> 
<td style="text-align: center;"><p id="B4S"></p></td> 
<td style="text-align: right;">Test3</td> 
</tr> 
<tr style="background-color:#f2eab3;line-height:30px"> 
<td>TEST4</td> 
<td style="text-align: center;">0</td> 
<td style="text-align: center;">0</td> 
<td style="text-align: right;">TEST4</td> 
</tr> 
</tbody> 
</table> 
</body> 
<script> 
window.onload = HideRow; 
</script> 
</html> 

,當我試圖提醒我發現這個問題在這條線的輸出

if (cells[j].innerHTML != '0') {  

代碼得到這個值:

<p id="B1S"></p> 
<p id="B4S"></p> 
<p id="B4S"></p> 
0 

只有最後一排被接受和隱藏,但其他人返回無與倫比的價值

謝謝。

+0

T只需在drawChart方法結束時觸發您的HideRow函數。 – Bardo

+0

@Bardo我做了但沒有發生任何事我在末尾添加了這段代碼

+0

@Bardo你能告訴我怎麼做? –

回答

0

我解決了 「感謝上帝」

使用

if (cells[j].getElementsByTagName('strong')[0].getElementsByTagName('p')[0].innerHTML != '0') 

,而不是

if (cells[j].innerHTML != '0') {  

這一切

感謝@Bardo和@Selim安心院對他的良好的矯正

相關問題