Copy kode kodenya sebagai berikut:
<html>
<skrip>
//Atur warna baris saat ini ketika mengklik baris yang dipilih saat ini, dan pulihkan warna dan aktivitas mouse pada baris selain baris saat ini.
fungsi selectRow(target)
{
var sTable = document.getElementById("ServiceListTable")
for(var i=1;i<sTable.rows.length;i++) //Melintasi semua baris kecuali baris pertama
{
if (sTable.rows[i] != target) //Tentukan apakah baris sedang dipilih
{
sTable.rows[i].bgColor = "#ffffff"; //Mengatur warna latar belakang
sTable.rows[i].onmouseover = resumeRowOver; //Tambahkan acara onmouseover
sTable.rows[i].onmouseout = resumeRowOut;//Tambahkan acara onmouseout
}
kalau tidak
{
sTable.baris[i].bgColor = "#d3d3d3";
sTable.rows[i].onmouseover = ""; //Hapus event mouse
sTable.rows[i].onmouseout = ""; //Hapus event mouse
}
}
}
//Warna latar belakang tr saat dipindahkan
fungsi rowOver(target)
{
target.bgColor='#e4e4e4';
}
//Warna latar belakang tr saat berpindah keluar
fungsi barisKeluar(target)
{
target.bgColor='#ffffff';
}
//Kembalikan event onmouseover tr yang mendukung fungsi pemanggilan
fungsi resumeRowOver()
{
rowOver(ini);
}
//Kembalikan event onmouseout tr yang mendukung fungsi pemanggilan
fungsi resumeRowOut()
{
barisKeluar(ini);
}
</skrip>
<tubuh>
<div onmouseover="javascript:this.style.backgroundColor='red';" onmouseout="javascript:this.style.backgroundColor='blue'">Untuk dua fungsi terakhir resumeRowOver dan resumeRowOut, silakan lihat apa yang saya tulis sebelumnya Tambahkan tabel yang sesuai dengan acara ke elemen halaman melalui js HTMLview plaincopy ke clipboardprint?
</div>
<tabel cellpacing="1" cellpadding="0" id="ServiceListTable">
<tr>
<th>Layanan itu penting</th>
<th>T</th>
<th>Statusnya</th>
<th>Tutup</th>
<th>Informasi</th>
</tr>
<tr onmouseover="rowOver(ini)" onmouseout="rowOut(ini)" onclick="selectRow(ini)">
<td>Konten terkait</td>
<td menyelaraskan="pusat"></td>
<td menyelaraskan="pusat"></td>
<td menyelaraskan="tengah"></td>
<td menyelaraskan="pusat"></td>
</tr>
<tr onmouseover="rowOver(ini)" onmouseout="rowOut(ini)" onclick="selectRow(ini)">
<td>Konten terkait</td>
<td menyelaraskan="pusat"></td>
<td menyelaraskan="pusat"></td>
<td menyelaraskan="pusat"></td>
<td menyelaraskan="pusat"></td>
</tr>
<tr onmouseover="rowOver(ini)" onmouseout="rowOut(ini)" onclick="selectRow(ini)">
<td>Konten terkait</td>
<td menyelaraskan="pusat"></td>
<td menyelaraskan="pusat"></td>
<td menyelaraskan="pusat"></td>
<td menyelaraskan="pusat"></td>
</tr>
<tr onmouseover="rowOver(ini)" onmouseout="rowOut(ini)" onclick="selectRow(ini)">
<td>Konten terkait</td>
<td menyelaraskan="pusat"></td>
<td menyelaraskan="pusat"></td>
<td menyelaraskan="pusat"></td>
<td menyelaraskan="pusat"></td>
</tr>
</tabel>
</tubuh>
</html>