我的問題是獲取onMouseover,onMouseout,onMousedown,onClick表格行。我爲此調用javascript用戶定義的函數。HTML + javascript鼠標懸停,mouseout,onclick不能在Firefox中工作
onMouseover ---背景顏色應該改變。 onMouseout ---重置爲原始顏色 onClick ---應設置第一列複選框/單選按鈕並且背景顏色應該改變 onMousedown ---背景顏色應該改變。
我的HTML代碼: - <tr onMouseOver="hover(this)" onMouseOut="hover_out(this)" onMouseDown="get_first_state(this)" onClick="checkit(this)" >
和JavaScript中的方法有: -
VAR first_state = FALSE;
var oldcol ='#ffffff'; var oldcol_cellarray = new Array();
功能懸停(元件){
if (! element) element = this;
while (element.tagName != 'TR') {
element = element.parentNode;
}
if (element.style.fontWeight != 'bold') {
for (var i = 0; i<element.cells.length; i++) {
if (element.cells[i].className != "no_hover") {
oldcol_cellarray[i] = element.cells[i].style.backgroundColor;
element.cells[i].style.backgroundColor='#e6f6f6';
}
}
}
}
// -------------------------- -------------------------------------------------- -------------------
功能hover_out(元件){
if (! element) element = this;
while (element.tagName != 'TR') {
element = element.parentNode;
}
if (element.style.fontWeight != 'bold') {
for (var i = 0; i<element.cells.length; i++) {
if (element.cells[i].className != "no_hover") {
if (typeof oldcol_cellarray != undefined) {
element.cells[i].style.backgroundColor=oldcol_cellarray[i];
} else {
element.cells[i].style.backgroundColor='#ffffff';
}
//var oldcol_cellarray = new Array();
}
}
}
}
// --------------------------------------------- --------------------------------------------------
功能get_first_state(元件){
while (element.tagName != 'TR') {
element = element.parentNode;
}
first_state = element.cells[0].firstChild.checked;
}
// -------------------------- -------------------------------------------------- -------------------
function checkit(element){
while (element.tagName != 'TR') {
element = element.parentNode;
}
if (element.cells[0].firstChild.type == 'radio') {
var typ = 0;
} else if (element.cells[0].firstChild.type == 'checkbox') {
typ = 1;
}
if (element.cells[0].firstChild.checked == true && typ == 1) {
if (element.cells[0].firstChild.checked == first_state) {
element.cells[0].firstChild.checked = false;
}
set_rowstyle(element, element.cells[0].firstChild.checked);
} else {
if (typ == 0 || element.cells[0].firstChild.checked == first_state) {
element.cells[0].firstChild.checked = true;
}
set_rowstyle(element, element.cells[0].firstChild.checked);
}
if (typ == 0) {
var table = element.parentNode;
if (table.tagName != "TABLE") {
table = table.parentNode;
}
if (table.tagName == "TABLE") {
table=table.tBodies[0].rows;
//var table = document.getElementById("js_tb").tBodies[0].rows;
for (var i = 1; i< table.length; i++) {
if (table[i].cells[0].firstChild.checked == true && table[i] != element) {
table[i].cells[0].firstChild.checked = false;
}
if (table[i].cells[0].firstChild.checked == false) {
set_rowstyle(table[i], false);
}
}
}
}
}
功能set_rowstyle(R,上){
if (on == true) {
for (var i =0; i < r.cells.length; i++) {
r.style.fontWeight = 'bold';
r.cells[i].style.backgroundColor = '#f2f2c2';
}
} else {
for (i =0; i < r.cells.length; i++) {
r.style.fontWeight = 'normal';
r.cells[i].style.backgroundColor = '#ffffff';
}
}
}
它正在按預期在IE中。
但來到Firefox我很驚訝看到輸出後,這麼多的編碼。
在Firefox中: - onMouseOver按預期工作。該特定行的顏色變化。
onClick - 永久性地設置背景顏色..第七步,我在不同的行上進行onmouseover。點擊的上一行顏色不會重置爲白色。 - 與預期不符
onclick on 2 rows..the background of the rows are set ..只有最新的行顏色應該設置。其他行被選定之前應該回退.. 不如預期即即使我點擊所有的行..背景顏色的一切都改變了......
雖然我點擊行。第一列,即單選按鈕或複選框沒有設置..
請幫我解決這個問題在Firefox中。請讓我知道我的代碼需要改變的地方...
在此先感謝!
嘗試使用Firebug(http://getfirebug.com/)來調試javascript。 – 2010-05-10 06:18:31