Javascript如何更改計時事件的細胞顏色？

目前我正在學習JavaScript，我希望得到一個細胞閃爍黃色在基於時間的事件，似乎JavaScript的失敗，每次我去的時間：當我的計時器達到5它Javascript如何更改計時事件的細胞顏色？

document.all.blinkyellow.bgColor = "yellow";

目前只是停止我猜測它在上面的代碼行失敗，因爲當我刪除它，定時器繼續無限。

完整的JavaScript下面是相關的html。我想知道如何在不使用JavaScript庫的情況下正確編輯單元格顏色。

這完全是這樣，我可以學習JavaScript作爲一個整體，而不是使用庫，而當我需要修改或插件時無法理解庫。

的Javascript：

var count=0; 
var time; 
var timer_is_on=0; 
setTimeout(doIt, 3000); 

function timedCount() 
{ 
    if(count == 6){  

    document.all.blinkyellow.bgColor = "yellow"; 

    } 
document.getElementById('txt').value=count; 

count=count+1; 
time=setTimeout("timedCount()",1000); 

} 

function doTimer() 
{ 
if (!timer_is_on) 
    { 
    timer_is_on=1; 
    timedCount(); 
    } 

}

HTML：

<table> 
<tbody> 
    <tr> 
    <td>Col 1</td> 
    <td>Col 2</td> 
    <td>Col 3</td> 
    <td>Col 3</td> 
    </tr> 
    <tr> 
    <td class="blinkyellow">Col 1</td> 
    <td>Col 2</td> 
    <td>Col 3</td> 
    <td>Col 3</td> 
    </tr> 
    <tr> 
    <td>Col 1</td> 
    <td>Col 2</td> 
    <td>Col 3</td> 
    <td>Col 3</td> 
    </tr> 
    <tr> 
    <td>Col 1</td> 
    <td>Col 2</td> 
    <td>Col 3</td> 
    <td>Col 3</td> 
    </tr> 
</tbody> 
</table>

來源

2011-06-23 Anicho

你是怎麼找到與「TXT」的ID元素？你也可以在你的setTimeout（doIt，3000）中調用doIt，你可能需要將它改爲setTimeout（「timedCount（）;」，3000）;

另外document.all只是IE（非常重要）！

var count=0; 
var time; 
var timer_is_on=0; 
setTimeout("timedCount();", 3000); 

function timedCount() 
{ 
    if(count == 6){  

    document.getElementById('blinkyellow').style.backgroundColor = "yellow"; 

    } 

count=count+1; 
time=setTimeout("timedCount()",1000); 

} 

function doTimer() 
{ 
if (!timer_is_on) 
    { 
    timer_is_on=1; 
    timedCount(); 
    } 

}

記得id，不class對TD的類更改爲一個id這樣

<td id="blinkyellow">Col 1</td>

來源

2011-06-23 15:15:44

感謝這工作我一直在嘗試做它在jsFiddle，但似乎是越野車使用.getElementByID我只是試圖在我的桌面上的HTML頁面，它似乎工作得很好:)。非常感謝您的幫助... – Anicho

doit應該是doTimer（），它確保按下按鈕時我們不會收到任何不需要的操作。 – Anicho

爲了得到一組類的元素，使用getElementsByClassName功能：

var elements = document.getElementsByClassName("blinkYellow");

然後，您可以通過該組元素的循環和風格適用於他們，用style.backgroundColor：

for(var i = 0; i < elements.length; i++) { 
    elements[i].style.backgroundColor = "yellow"; 
}

見該工作here一個例子。

來源

2011-06-23 15:15:42

感謝如果我能接受兩個答案，那麼你的支持工作。 – Anicho

@Anicho - 沒問題！請記住，如果您使用'getElementById'與多個元素共享相同的'id'，那麼您可能會遇到問題。在這種情況下，你將不得不使用'class'，就像我在這裏所做的那樣。 –

的document.all.foo語法得到元素。

因此，如果您將<td class="blinkyellow">更改爲<td id="blinkyellow">，它將起作用。

或更好的是，使用more supporteddocument.getElementById('blinkyellow')語法。

來源

2011-06-23 15:18:52 Emmett

如果你想使用jQuery，那麼它很簡單..

$(document).ready(
    function() 
    { 
     $(this).oneTime(
      3000, 
      function() 
      { 
       $('.blinkyellow').css('background-color', 'yellow'); 
      } 
     ); 
    } 
);

請務必下載Timers和jQuery

來源

2011-06-23 15:28:24

感謝您的jquery答案感謝能夠看到差異我正在學習純JavaScript，然後才決定學習正常的jscript。 – Anicho

當你想要一個給定函數反覆調用，例如每一秒，你應該使用window.setInterval(code_or_function, milliseconds)方法：

var count = 0; 
var interval = setInterval(timedCount, 1000); 

function timedCount() { 
    count++; 
    document.getElementById("txt").value = count; 
    if (count == 6) { 
     document.getElementById("blinkyellow").style.backgroundColor = "yellow"; 
     window.clearInterval(interval); // Stops the timer 
    } 
}

來源

2011-06-23 15:51:47 Luc125

Javascript如何更改計時事件的細胞顏色？

回答

相關問題