JavaScript實(shí)現(xiàn)點(diǎn)擊單元格改變背景色的方法
本文實(shí)例講述了JavaScript實(shí)現(xiàn)點(diǎ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++) { //如果要?jiǎng)h除其它列的顏色,請(qǐng)加上下面的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動(dòng)畫(huà)特效與技巧匯總》、《JavaScript運(yùn)動(dòng)效果與技巧匯總》及《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
- js點(diǎn)擊彈出div層實(shí)現(xiàn)可拖曳的彈窗效果
- CSS+JS實(shí)現(xiàn)點(diǎn)擊文字彈出定時(shí)自動(dòng)關(guān)閉DIV層菜單的方法
- js+CSS實(shí)現(xiàn)彈出居中背景半透明div層的方法
- JS彈出可拖拽可關(guān)閉的div層完整實(shí)例
- JS實(shí)現(xiàn)帶圓弧背景漸變效果的導(dǎo)航菜單代碼
- JS實(shí)現(xiàn)進(jìn)入頁(yè)面時(shí)漸變背景色的方法
- javascript設(shè)置頁(yè)面背景色及背景圖片的方法
- js獲取及修改網(wǎng)頁(yè)背景色和字體色的方法
- JavaScript實(shí)現(xiàn)的背景自動(dòng)變色代碼
- javascript實(shí)現(xiàn)網(wǎng)頁(yè)背景煙花效果的方法
- js點(diǎn)擊列表文字對(duì)應(yīng)該行顯示背景顏色的實(shí)現(xiàn)代碼
- 神奇!js+CSS+DIV實(shí)現(xiàn)文字顏色漸變效果
- JavaScript+html5 canvas繪制漸變區(qū)域完整實(shí)例
- JavaScript實(shí)現(xiàn)彈出DIV層同時(shí)頁(yè)面背景漸變成半透明效果
相關(guān)文章
js/jQuery簡(jiǎn)單實(shí)現(xiàn)選項(xiàng)卡功能
本篇文章主要是對(duì)js/jQuery簡(jiǎn)單實(shí)現(xiàn)選項(xiàng)卡功能的示例代碼進(jìn)行了介紹,需要的朋友可以過(guò)來(lái)參考下,希望對(duì)大家有所幫助2014-01-01javascript+css3開(kāi)發(fā)打氣球小游戲完整代碼
這是一個(gè)簡(jiǎn)單但是印象深刻的小游戲,打氣球小游戲的實(shí)現(xiàn)代碼,主要基于js和css3,基于css3畫(huà)氣球,具體實(shí)現(xiàn)代碼大家參考下本文2017-11-11JS實(shí)現(xiàn)的數(shù)組去除重復(fù)數(shù)據(jù)算法小結(jié)
這篇文章主要介紹了JS實(shí)現(xiàn)的數(shù)組去除重復(fù)數(shù)據(jù)算法,總結(jié)分析了4種比較常見(jiàn)的數(shù)組去重復(fù)算法及相關(guān)使用技巧,需要的朋友可以參考下2017-11-11JavaScript中如何讓?x?==?1?&&?x?==?2?&&?x?==?3?等式成立
這篇文章主要介紹了JavaScript中如何讓x==1&&x==2&&x==3等式成立,文章圍繞主題展開(kāi)詳細(xì)的內(nèi)容介紹,具有一定的參考價(jià)值,需要的小伙伴可以參考一下2022-07-07JS加jquery簡(jiǎn)單實(shí)現(xiàn)標(biāo)簽元素的顯示或隱藏
標(biāo)簽元素的顯示或隱藏在使用中還是挺頻繁的,下面有個(gè)不錯(cuò)的示例,大家可以參考下,或許有所幫助2013-09-09Openlayers實(shí)現(xiàn)地圖的基本操作
這篇文章主要為大家詳細(xì)介紹了Openlayers實(shí)現(xiàn)地圖的基本操作,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-09-09利用a標(biāo)簽自動(dòng)解析URL分析網(wǎng)址實(shí)例
a標(biāo)簽也和window.location一樣,也有這樣屬性,因此可以利用它來(lái)分析網(wǎng)址,下面的實(shí)例代碼,大家可以看看2014-10-10Bootstrap教程JS插件滾動(dòng)監(jiān)聽(tīng)學(xué)習(xí)筆記分享
這篇文章主要為大家分享了Bootstrap教程JS插件滾動(dòng)監(jiān)聽(tīng)學(xué)習(xí)筆記,內(nèi)容很詳細(xì),感興趣的小伙伴們可以參考一下2016-05-05