JavaScript實現(xiàn)點擊單元格改變背景色的方法
本文實例講述了JavaScript實現(xiàn)點擊單元格改變背景色的方法。分享給大家供大家參考,具體如下:
<html>
<body>
<table onclick="SetColor(event)" id="_t" width="500" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="93" height="29" background="hotlinkbg.gif" align="center">出租信息</td>
<td width="93" height="29" background="hotlinkbg.gif" align="center">求租信息</td>
<td width="314" height="29" background="hotlinkbg.gif" ></td>
</tr>
</table>
<table width="500">
<tr>
<td>aaaaa</td>
<td>bbbbb</td>
<td>ccccc</td>
<td>ddddd</td>
</tr>
</table>
<script tyle="text/javascript">
var oldClr = new Array()
function SetColor(e)
{
if (!e) e = window.event;
var obj
if(window.event)
obj = e.srcElement
else
obj = e.target
if(obj.tagName != "TD") return
var oldTD = obj
while( obj.tagName != "TR")
obj = obj.parentNode
var i
for(i = 0;i<obj.cells.length;i++)
{
if(obj.cells[i] == oldTD) break
}
var table = document.getElementById("_t")
for(j = 0;j<table.rows.length;j++)
{
//如果要刪除其它列的顏色,請加上下面的3行
for(m = 0;m < table.rows[j].cells.length;m++)
{
table.rows[j].cells[m].background = oldClr[m]
}
//table.rows[j].cells[i].bgColor = table.rows[j].cells[i].background="button1_on.gif"
table.rows[j].cells[i].background = table.rows[j].cells[i].background==oldClr[i]?"button1_on.gif":oldClr[i]
}
}
window.onload = function()
{
var table = document.getElementById("_t")
for(j = 0;j<table.rows[0].cells.length;j++)
{
oldClr[j] = table.rows[0].cells[j].background
}
}
</script>
</body>
</html>
更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《JavaScript動畫特效與技巧匯總》、《JavaScript運動效果與技巧匯總》及《JavaScript錯誤與調(diào)試技巧總結(jié)》
希望本文所述對大家JavaScript程序設(shè)計有所幫助。
- js點擊彈出div層實現(xiàn)可拖曳的彈窗效果
- CSS+JS實現(xiàn)點擊文字彈出定時自動關(guān)閉DIV層菜單的方法
- js+CSS實現(xiàn)彈出居中背景半透明div層的方法
- JS彈出可拖拽可關(guān)閉的div層完整實例
- JS實現(xiàn)帶圓弧背景漸變效果的導航菜單代碼
- JS實現(xiàn)進入頁面時漸變背景色的方法
- javascript設(shè)置頁面背景色及背景圖片的方法
- js獲取及修改網(wǎng)頁背景色和字體色的方法
- JavaScript實現(xiàn)的背景自動變色代碼
- javascript實現(xiàn)網(wǎng)頁背景煙花效果的方法
- js點擊列表文字對應該行顯示背景顏色的實現(xiàn)代碼
- 神奇!js+CSS+DIV實現(xiàn)文字顏色漸變效果
- JavaScript+html5 canvas繪制漸變區(qū)域完整實例
- JavaScript實現(xiàn)彈出DIV層同時頁面背景漸變成半透明效果
相關(guān)文章
javascript+css3開發(fā)打氣球小游戲完整代碼
這是一個簡單但是印象深刻的小游戲,打氣球小游戲的實現(xiàn)代碼,主要基于js和css3,基于css3畫氣球,具體實現(xiàn)代碼大家參考下本文2017-11-11
JS實現(xiàn)的數(shù)組去除重復數(shù)據(jù)算法小結(jié)
這篇文章主要介紹了JS實現(xiàn)的數(shù)組去除重復數(shù)據(jù)算法,總結(jié)分析了4種比較常見的數(shù)組去重復算法及相關(guān)使用技巧,需要的朋友可以參考下2017-11-11
JavaScript中如何讓?x?==?1?&&?x?==?2?&&?x?==?3?等式成立
這篇文章主要介紹了JavaScript中如何讓x==1&&x==2&&x==3等式成立,文章圍繞主題展開詳細的內(nèi)容介紹,具有一定的參考價值,需要的小伙伴可以參考一下2022-07-07
Bootstrap教程JS插件滾動監(jiān)聽學習筆記分享
這篇文章主要為大家分享了Bootstrap教程JS插件滾動監(jiān)聽學習筆記,內(nèi)容很詳細,感興趣的小伙伴們可以參考一下2016-05-05

