Rumah >hujung hadapan web >tutorial js >Kod kesan penyerlahan klik tetikus baris jadual yang dilaksanakan oleh kemahiran JS_javascript
Contoh dalam artikel ini menerangkan kod untuk kesan penyerlahan klik tetikus bagi baris jadual yang dilaksanakan dalam JS. Kongsikan dengan semua orang untuk rujukan anda, butirannya adalah seperti berikut:
Sesekali apabila saya membaca pengumuman nilai bersih Rangkaian Dana Tiantian, saya mendapati sekeping kod js dilucutkan daripada kod sumber saya rasa ia lebih praktikal, saya ingin berkongsinya (hanya sah untuk IE)
<script type="text/javascript"> var highlightcolor='#E0F2FE'; var clickcolor='#ffedd2'; function MouseOver(){ var source=event.srcElement; if (source.tagName=="TD"){ source=source.parentElement; var cells = source.children; if (cells[0].style.backgroundColor!=highlightcolor&&cells[0].style.backgroundColor!=clickcolor) for(i=0;i<cells.length;i++){ cells[i].style.backgroundColor=highlightcolor; } } } function MouseOut(){ var source=event.srcElement; if (source.tagName=="TD"){ source=source.parentElement; var cells = source.children; if (cells[0].style.backgroundColor!=clickcolor) for(i=0;i<cells.length;i++){ cells[i].style.backgroundColor=""; } } } function MouseClick(){ var source=event.srcElement; if (source.tagName=="TD"){ source=source.parentElement; var cells = source.children; if (cells[0].style.backgroundColor!=clickcolor) for(i=0;i<cells.length;i++) cells[i].style.backgroundColor=clickcolor; else for(i=0;i<cells.length;i++) cells[i].style.backgroundColor=""; } } </script> <table onmouseover="MouseOver()" onclick="MouseClick()" onmouseout="MouseOut()" cellspacing="0" bordercolordark="#ffffff" bordercolorlight="#cccccc" border="1" width="80%" align="center" style="cursor:pointer"> <tr> <td>1</td> <td>a</td> <td>b</td> </tr> <tr> <td>2</td> <td>c</td> <td>d</td> </tr> <tr> <td>3</td> <td>e</td> <td>f </td> </tr> <tr> <td>4</td> <td>g</td> <td>h </td> </tr> </table>
Saya harap artikel ini akan membantu semua orang dalam pengaturcaraan JavaScript.