双11狂欢大促

盲盒赢 定制羽绒服

开启惊喜盲盒，抽取你的专属好礼

— 惊喜奖品抢先看 —

超级年卡50元券

周边70元券

手机支架

一拖三数据线

雨伞

运动毛巾

电动牙刷

VIP月卡

机械键盘

定制羽绒服

超级年卡50元券

周边70元券

手机支架

一拖三数据线

雨伞

运动毛巾

电动牙刷

VIP月卡

机械键盘

定制羽绒服

点击table单元格改变原有背景图,再点击还原的问题,等高手

2011-11-26 02:52:57 205 阅读 AI 写同款 · GEO 优化AI 选题数据监测一键分发 ›

aykkk 墨衍会员 · AI 创作全网分发关注 + 加入社区

ComfyUI安装包运行前准备：安装Git Git 是一个分布式版本控制系统（Version Control System, VCS），用于跟踪和管理文件（尤其是代码）的变更历史。简单理解就是，git是用来管理文件的版本的，如果有新的版本，就可以使用git来更新。阅读详情

我在网上找了一段代码,如下:
<table width="42" height="12" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="14" height="12" background="img/1.gif" onclick= "this.background=this.background=='img/2.gif'?'img/1.gif':'img/2.gif'"> </td>
<td width="14" height="12" background="img/1.gif" onclick= "this.background=this.background=='img/2.gif'?'img/1.gif':'img/2.gif'"> </td>
<td width="14" height="12" background="img/1.gif" onclick= "this.background=this.background=='img/2.gif'?'img/1.gif':'img/2.gif'"> </td>
</tr>
</table>
经测试在ie中正常,在ff中不能达到目的,如何能让上面的代码兼容ie,ff?另外如何使用jquery达到相同的目的?
坐等高手指导.

...全文

康耐视 VisionPro CogImageFileTool(将获得的图像保存至文件或从文件中获取图像)工具 VisionPro CogImageFileTool(将获得的图像保存至文件或从文件中获取图像)工具阅读详情

aykkk

CSS 61,116 成员 60,701 内容

+ 关注 + 加入社区

切换为时间正序

aykkk 2011-11-26

打赏
举报

呵呵,应该把if(tds[i].className == 'no_back')continue;
改成if(tds[i].className != 'no_back')continue;
谢谢了,结贴了

MuBeiBei 2011-11-26

打赏
举报

[Quote=引用 11 楼 aykkk 的回复:]

我说的不是最后一个单元格,是最后一行单元格,比如
<table width="42" height="12" border="1" cellpadding="0" cellspacing="0">
循环开始
<tr>
<td width="14" height="12" ><%#eval("a")</td>
<td width="14" height="12" ><%#eva……
[/Quote]

那你就给你这最后一行的td加上 class="no_back"

aykkk 2011-11-26

打赏
举报

我说的不是最后一个单元格,是最后一行单元格,比如
<table width="42" height="12" border="1" cellpadding="0" cellspacing="0">
循环开始
<tr>
<td width="14" height="12" ><%#eval("a")</td>
<td width="14" height="12" ><%#eval("x")</td>
<td width="14" height="12" ><%#eval("c")</td>
</tr>
循环结束
<tr>
<td width="14" height="12" style="background-image:url(img/1.gif);"> </td>
<td width="14" height="12" style="background-image:url(img/1.gif)"> </td>
<td width="14" height="12" style="background-image:url(img/1.gif)"> </td>
</tr>
</table>
这样的

MuBeiBei 2011-11-26

打赏
举报

<table width="42" height="12" border="1" cellpadding="0" cellspacing="0">
<tr>
<td width="14" height="12" style="background-image:url(img/1.gif);"> </td>
<td width="14" height="12" style="background-image:url(img/1.gif)"> </td>
<td width="14" height="12" style="background-image:url(img/1.gif)"> </td>
<td class="no_back">静态td,不加onclick事件</td>
</tr>
</table>

<script>
var tds = document.getElementsByTagName('td');

for(var i = 0; i < tds.length; i++){
if(tds[i].className == 'no_back')continue;
tds[i].onclick = function(){
if(document.all){
if(this.style.backgroundImage == 'url(img/2.gif)'){
this.style.backgroundImage = 'url(img/1.gif)';
}else{
this.style.backgroundImage = 'url(img/2.gif)';
}
}else{
if(this.style.backgroundImage == 'url("img/2.gif")'){
this.style.backgroundImage = 'url("img/1.gif")';
}else{
this.style.backgroundImage = 'url("img/2.gif")';
}
}
};
}
</script>

MuBeiBei 2011-11-26

打赏
举报

[Quote=引用 8 楼 aykkk 的回复:]

多谢大神,好使,不过问题又来了,我的表格中的数据由数据库中提取,根据条件不同,取出的数量也不同,比如30条,50条等等,我现在只希望在表格的最后一行执行这个操作,其他行不响应,如何办到.你看这样行不行,我把最后一行写成静态硬编码,并且给这一行的<tr>赋予一个ID,然后把这行代码
var tds = document.getElementsByTagName('td');
改成
var t……
[/Quote]

var tds = document.getElementsByTagName('td');就用这个就行

你给最后的静态td加个class

然后循环里面做个判断

如果td.className == '静态的TD class'就continue

aykkk 2011-11-26

打赏
举报

多谢大神,好使,不过问题又来了,我的表格中的数据由数据库中提取,根据条件不同,取出的数量也不同,比如30条,50条等等,我现在只希望在表格的最后一行执行这个操作,其他行不响应,如何办到.你看这样行不行,我把最后一行写成静态硬编码,并且给这一行的<tr>赋予一个ID,然后把这行代码
var tds = document.getElementsByTagName('td');
改成
var tds = document.getElementsByTagName('TR#ID td');
这样行不行?

MuBeiBei 2011-11-26

打赏
举报

	<table width="42" height="12" border="1" cellpadding="0" cellspacing="0">

  <tr>

  <td width="14" height="12" style="background-image:url(img/1.gif);"> </td>

  <td width="14" height="12" style="background-image:url(img/1.gif)"> </td>

  <td width="14" height="12" style="background-image:url(img/1.gif)"> </td>

  </tr>

</table>



<script>

	var tds = document.getElementsByTagName('td');

	

	for(var i = 0; i < tds.length; i++){

		tds[i].onclick = function(){

			if(document.all){

				if(this.style.backgroundImage == 'url(img/2.gif)'){

					this.style.backgroundImage = 'url(img/1.gif)';

				}else{

					this.style.backgroundImage = 'url(img/2.gif)';	

				}

			}else{

				if(this.style.backgroundImage == 'url("img/2.gif")'){

					this.style.backgroundImage = 'url("img/1.gif")';

				}else{

					this.style.backgroundImage = 'url("img/2.gif")';

				}	

			}

		};	

	}

</script>

MuBeiBei 2011-11-26

打赏
举报

td里面的onclick事件可以删掉了~·

MuBeiBei 2011-11-26

打赏
举报

	<table width="42" height="12" border="1" cellpadding="0" cellspacing="0">

  <tr>

  <td width="14" height="12" style="background-image:url(img/1.gif);" onclick= "this.style.background=this.style.backgroundImage=='url(img/2.gif)'?'url(img/1.gif)':'url(img/2.gif)'"> </td>

  <td width="14" height="12" style="background-image:url(img/1.gif)" onclick= "this.style.background=this.style.backgroundImage=='url(img/2.gif)'?'url(img/1.gif)':'url(img/2.gif)'"> </td>

  <td id="a" width="14" height="12" style="background-image:url(img/1.gif)" onclick= "this.style.background=this.style.backgroundImage=='url(img/2.gif)'?'url(img/1.gif)':'url(img/2.gif)'"> </td>

  </tr>

</table>



<script>

	var tds = document.getElementsByTagName('td');

	

	for(var i = 0; i < tds.length; i++){

		tds[i].onclick = function(){

			if(document.all){

				if(this.style.backgroundImage == 'url(img/2.gif)'){

					this.style.backgroundImage = 'url(img/1.gif)';

				}else{

					this.style.backgroundImage = 'url(img/2.gif)';	

				}

			}else{

				if(this.style.backgroundImage == 'url("img/2.gif")'){

					this.style.backgroundImage = 'url("img/1.gif")';

				}else{

					this.style.backgroundImage = 'url("img/2.gif")';	

				}	

			}

		};	

	}

</script>

用这个

aykkk 2011-11-26

打赏
举报

如果换成如下代码
<table width="42" height="12" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="14" height="12" style="background:url(img/1.gif)" onclick= "this.style.background=this.style.background=='url(img/2.gif)'?'url(img/1.gif)':'url(img/2.gif)'"> </td>
<td width="14" height="12" style="background:url(img/1.gif)" onclick= "this.style.background=this.style.background=='url(img/2.gif)'?'url(img/1.gif)':'url(img/2.gif)'"> </td>
<td width="14" height="12" style="background:url(img/1.gif)" onclick= "this.style.background=this.style.background=='url(img/2.gif)'?'url(img/1.gif)':'url(img/2.gif)'"> </td>
</tr>
</table>
则IE中有效了,FF中第一点击有效,再点击无法还原

aykkk 2011-11-26

打赏
举报

大神,用了您的代码,在ie中点击背景图消失,再点击不还原,FF中仍然无效

MuBeiBei 2011-11-26

打赏
举报

<table width="42" height="12" border="0" cellpadding="0" cellspacing="0">

  <tr>

  <td width="14" height="12" style="background:url(img/1.gif)" onclick= "this.style.background=this.style.background=='img/2.gif'?'img/1.gif':'img/2.gif'"> </td>

  <td width="14" height="12" style="background:url(img/1.gif)" onclick= "this.style.background=this.style.background=='img/2.gif'?'img/1.gif':'img/2.gif'"> </td>

  <td width="14" height="12" style="background:url(img/1.gif)" onclick= "this.style.background=this.style.background=='img/2.gif'?'img/1.gif':'img/2.gif'"> </td>

  </tr>

</table>

用这个我之前发的错了

MuBeiBei 2011-11-26

打赏
举报

<table width="42" height="12" border="0" cellpadding="0" cellspacing="0">

  <tr>

  <td width="14" height="12" background="img/1.gif" onclick= "this.style.background=this.style.background=='img/2.gif'?'img/1.gif':'img/2.gif'"> </td>

  <td width="14" height="12" background="img/1.gif" onclick= "this.style.background=this.style.background=='img/2.gif'?'img/1.gif':'img/2.gif'"> </td>

  <td width="14" height="12" background="img/1.gif" onclick= "this.style.background=this.style.background=='img/2.gif'?'img/1.gif':'img/2.gif'"> </td>

  </tr>

</table>

✦双11狂欢大促✦

点击table单元格改变原有背景图,再点击还原的问题,等高手

相关推荐

双11狂欢大促