在不给ｔｄ加ｉｄ的情况下，怎么让ｔｄ延时变色

flashsoft2000 2002-09-26 10:54:57

我现在的代码入下
但是我希望可以看到多种的解决方案，比如类似于类的解决方式，用ｈｔａ封装的解决方式
还有一般的解决方式，但是都有一个前提，就是不可以加ｉｄ，不可以非常耗资源
谢谢大家
希望可以得到大家的解决
...全文
65 20 打赏 收藏 转发到动态 举报
写回复
用AI写文章
20 条回复
切换为时间正序
请发表友善的回复…
发表回复
flashsoft2000 2002-09-27
  • 打赏
  • 举报
 回复
精彩～～
鼓励，好了，我的疑问在此结帖
分配分数开始
Lostinet 2002-09-27
  • 打赏
  • 举报
 回复
修正一下。。~~
function getFuncSelf()
{
return getFuncSelf.caller;//返回调用者
}
var myfunc=new Function("","eventNext(event,getFuncSelf().element)");
myfunc.element=elementRef;
setTimeout(myfunc,1000);
Lostinet 2002-09-27
  • 打赏
  • 举报
 回复
续：
使用elementRef.attachEvent时，event.srcElement不是elementRef怎么办？
使用一个通用的EventDelegate的方法：
function EventDelegate(element,func,context)
{
var uid=element.uniqueID;
element=null;
return Delegate;
function Delegate(event)
{
var e=document.getElementById(uid);
if(e)
return func(event,e,context);
}
}

outp.attachEvent("onmouseout",EventDelegate(outp,onout,1));
function onout(event,element,context)
{
alert(element.outerHTML+context);
}

----------------------------------
延迟变色时用setTimeout怎样传递参数？
传递参数有两种方法。一种是用全局变量，经常是elementRef.uniqueID，也可以是自己定义的某种集合和其对应的id
例如：
setTimeout("eventNext(\""+elementRef.uniqueID+"\")",1000);
function eventNext(strUid)
{
var e=document.getElementById(strUid);
//...
}

一种是用非全局变量。一般是某个对象的属性（Property）例如：
function getFuncSelf()
{
return getFuncSelf.caller;//返回调用者
}
var myfunc=new Function("","eventNext(getFuncSelf().element)");
myfunc.element=elementRef;
setTimeout(myfunc,1000);


Lostinet 2002-09-27
  • 打赏
  • 举报
 回复
：）
抛开Behavior不说

要求在事件时令一个TD变色。
有下面几个要素：
1：什么事件
2：事件发生的地区（在哪个元素上发生）
3：怎样关联事件？
4：需要变哪个TD
5：怎样找到那个TD

------------------
好了。对于1，答案是onmouseover,onmouseout
2：发生在TD，或者TD包含的元素中
3：
设置元素的onmouseover,onmouseout（不过这个和设ID没有什么区别）
在运行的时候关联事件，这需要tdref.attachEvent
一般是：在window.onload时找到所有需要变色的TD，然后逐个调用attachEvent
或者在document.onmouseover,document.onmouseout时，由事件的发出元素，往父元素搜索。搜到就令它变色。
在自己定义的时候，或者是在td创建后（例如tdref=trref.insertRow())，就为它关联上事件。
每个TD都加上onmouseover="attachMYTD(this)",然后第一次移动到的时候把tdref.onmouseover替换掉。
方法很多。略。。。

4：
这个只有作者才知道。但是作者要令程序知道。
5：
这个是回答4怎样另程序知道的。
一般是：
td是自己运行时用document.createElement,trref.insertRow等方法创建的。
那么就直接在得到引用时关联事件。
td是由服务器生成的标签，或者是document.write出来，或者是innerHTML,insertAdjacentHTML等。。。出来的。
那么需要为那TD做标记。
标记的方法有：
为TD直接做标记，例如id（不过这个不属于讨论范围）
例如className,STYLE，这个可以让程序判断，还可以自己引用全局的STYLE的Expression来运行某段代码。
例如为TD加上自定义标签的：name,myname,ismytd。
那么这些情况一般是用document.all.tags("TD")返回的集合来搜索需要的TD

第二个方法是为TD相关的元素做标记，然后用父子关系得到那TD：
例如父的TABLE，为TABLE加上标记，方法同上（包括为TABLE加ID）。
那么得到TABLE后，就可以使用tableref.rows(index).cols(index)得到那TD了。
也可以是在THEAD，TBODY，TFOOT上做这个。
可以先找到一个特定结构的HTML中的一个元素，然后直接指定那TABLE，或TD。
（例如那HTML是用somecontainer.insertAdjacentHTML(,sometemplate.innerHTML)来复制出来的）
那么可以用somecontainer.children(i).children(j).children(k).rows(l).cols(m)得到那TD。

完。

flashsoft2000 2002-09-27
  • 打赏
  • 举报
 回复
up一下
flashsoft2000 2002-09-26
  • 打赏
  • 举报
 回复
sorry
刚才没有注意看，其实是可以了
继续求助
如果不是ｈｔａ的那？
用类的方式那，怎么搞，继续问秋水，最好是不要用指定所有的ｔｄ的方式
可以指定ｔａｂｌｅ的ｉｄ
继续问中
flashsoft2000 2002-09-26
  • 打赏
  • 举报
 回复
2.function className(){
this.id=1
}
？？？？？
不懂
因为现在的情况会出现跳格的情况，比如隔行变色了，不是连续的
请教
yonghengdizhen 2002-09-26
  • 打赏
  • 举报
 回复
<HTML XMLNS:QBNS>

<PUBLIC: COMPONENT URN="QueryBox">
<PUBLIC:PROPERTY ID="formName_ID" NAME="formName" PUT="putFormName" />
<PUBLIC:PROPERTY ID="formAction_ID" NAME="formAction" PUT="putFormAction"/>
<PUBLIC:PROPERTY ID="basicQry_ID" NAME="basicQry" PUT="putBasic" GET="getBasic"/>
<PUBLIC:PROPERTY ID="advanceQry_ID" NAME="advanceQry" PUT="putAdvance" GET="getAdvance"/>
<PUBLIC:PROPERTY NAME="submitLabel" PUT="pubSubmitLabel"/>
<PUBLIC:PROPERTY NAME="cancelLabel" PUT="pubCancelLabel"/>
<PUBLIC:METHOD NAME="showBox" />
<PUBLIC:ATTACH event="ondocumentready" onevent="fnInit();"/>

<HEAD>


<PUBLIC:COMPONENT tagName="QB">
<ATTACH EVENT="oncontentready" ONEVENT="fnInit()"/>
</PUBLIC:COMPONENT>

<SCRIPT LANGUAGE="JavaScript">
<!--
function fnInit() {
showBox()
//defaults.viewLink = document;
}

// -->
</SCRIPT>


</HEAD>

<BODY>


<DIV ID="WHOLE">

<FORM NAME="QB_FORM" METHOD="POST">

<script language="javascript" defer>
<!--
function Frame_Switch(Para_Div_Name)
{

if (document.getElementById(Para_Div_Name).style.display=='block' || document.getElementById(Para_Div_Name).style.display=='')
{
document.getElementById(Para_Div_Name).style.display='none';

}
else if (document.getElementById(Para_Div_Name).style.display=='none')
{
document.getElementById(Para_Div_Name).style.display='block';

}
}
function btn_close_onclick()
{
alert("OK")
}
-->
</script>



<STYLE>
TD {
background-color:tan;
width:50;
height:50;
}


.pxborder_input
{
border-right: #cccccc 0px solid;
border-top: #cccccc 0px solid;
border-left: #cccccc 0px solid;
border-bottom: #cccccc 2px solid;
}
.inputbox_no_border
{
border-right: #cccccc 1px solid;
border-top: #cccccc 1px solid;
border-left: #cccccc 1px solid;
border-bottom: #cccccc 1px solid;
background: pink;
}


</STYLE>

<TABLE ID="TBLID_1" NAME="TBLNAME_1" BORDER="1" ALIGN="CENTER" cellspacing=1 cellpadding=1 width="60%">
<TR height=120 valign=bottom width="100%" ID="DIV_1">
<TD width="100%">
<Input type=textbox id="TBID_1" name="TBNA_1" class=pxborder_input size="70%">
<DIV ID="TBID_1" NAME="TBNA_1"></DIV>
</TD>
</TR>

<TR width="100%">
<TD width="100%">
<a href="#" id="HLID_Exchange" name="HLNA_Exchange" onclick="" value="">▲</a>
<input type=button name="btn_close" value="close" onclick="btn_close_onclick()">
</TD>
</TR>

<TR height=120 valign=bottom width="100%" ID="DIV_2">
<TD width="100%">
<Input type=textbox id="TBID_2" name="TBNA_2" class=pxborder_input size="70%">
<DIV ID="TBID_2" NAME="TBNA_2"></DIV>
</TD>
</TR>

<TR width="100%">
<TD width="100%">
<Input type=button id="TBID_Query" name="TBNAME_Query" value="Search" onclick="Return_Search_Result();">
<Input type=button id="TBID_Cancel" name="TBNAME_Cancel" value="Cancel">
</TD>
</TR>
</TABLE>

</FORM>

</DIV>


</BODY>
</HTML>


<Script language="javascript">
function showBox(){
var eDiv;

eDiv = document.createElement("DIV");
element.appendChild(eDiv);

//eDiv.style.position ="absolute";
eDiv.style.top = "200";
eDiv.style.left = "300";
eDiv.style.width = "300";
eDiv.style.zIndex = "10";
eDiv.style.border="1 solid";
eDiv.style.borderWidth="1";
eDiv.style.backgroundColor="#f8f4e4"
eDiv.style.padding = "10";
eDiv.id = "popLayer";
eDiv.innerHTML=WHOLE.innerHTML

str="if (element.document.getElementById('DIV_2').style.display=='block' || element.document.getElementById('DIV_2').style.display=='')"
str+="{element.document.getElementById('DIV_2').style.display='none';}"
str+="else if (element.document.getElementById('DIV_2').style.display=='none')"
str+="{element.document.getElementById('DIV_2').style.display='block';}"
//var func=new Function("Frame_Switch('DIV_2')")
//str="alert('xxx');document.getElementById('DIV_2').style.display='none';"
newelement=document.createElement("input")
newelement.type="button"
newelement.value="button"
newelement.attachEvent('onclick',new Function(str))
eDiv.appendChild(newelement);
//alert(element.document.documentElement.outerHTML)
}
</Script>

</PUBLIC: COMPONENT>
qiushuiwuhen 2002-09-26
  • 打赏
  • 举报
 回复
1.htc现在就是延迟回复

2.function className(){
this.id=1
}
flashsoft2000 2002-09-26
  • 打赏
  • 举报
 回复
你刚才的那个虽然是延时了，但是无法控制时间长短
用ｓｅｔＴｉｍｅｏｕｔ　ｏｒｓｅｔＩｎｎｅｒｖａｌ？？？？
flashsoft2000 2002-09-26
  • 打赏
  • 举报
 回复
ｔｏ　：秋水
如果我要的是
鼠标移开的时候是延时回复背景色那，
还有类的写法怎么写？
谢谢
qimangxing 2002-09-26
  • 打赏
  • 举报
 回复
gz中。。。。。。。。。。。。
qiushuiwuhen 2002-09-26
  • 打赏
  • 举报
 回复
效果有点炫
td.htc

<attach event="onmouseover" handler="doOver" />
<attach event="onmouseout" handler="doOut" />
<script>
function doOver() {
this.style.background='fefefe';this.style.borderLeft='5 solid #ff9900'
}
function doOut() {
setTimeout(this.uniqueID+".style.background='f4f4f4';"+this.uniqueID+".style.borderLeft='5 solid #cccccc'",100);
}
</script>
qiushuiwuhen 2002-09-26
  • 打赏
  • 举报
 回复
<style>
body,td,a{
font-size:9pt;
}
td{behavior:url(td.htc)}
</style>
<table style="width:200;border:#cccccc 1 solid" id="TempTable">
<script>
for(i=0;i<20;i++)document.write("<tr><td style='border-left:5 solid #cccccc;background:#f4f4f4'>¡¡menu"+i+"</td></tr>");
</script>
</table>
flashsoft2000 2002-09-26
  • 打赏
  • 举报
 回复
还没有人看，我再ｔ
flashsoft2000 2002-09-26
  • 打赏
  • 举报
 回复
楼上回答的不是我要的，我需要的效果是离开时候改变颜色的时候是延时改变回去
而且楼上的回答的局限性也太大了点
继续询问
顺便ｔ一脚
binscut 2002-09-26
  • 打赏
  • 举报
 回复
<style>
body,td,a{
font-size:9pt;
}
</style>
<body>
<table style="width:200;border:#cccccc 1 solid" id="TempTable">
<script>
for(i=0;i<20;i++)document.write("<tr><td style='border-left:5 solid #cccccc;background:#f4f4f4'>¡¡menu"+i+"</td></tr>");
</script>
</table>
<script>
function document.onmouseover(){
var el=window.event.srcElement;
if(el.tagName!='TD') return;
el.style.background="#4f4f4f";
}

function document.onmouseout(){
var el=window.event.srcElement;
if(el.tagName!='TD') return;
el.style.background="#f4f4f4";
}
</script>
</body>
flashsoft2000 2002-09-26
  • 打赏
  • 举报
 回复
<style>
body,td,a{
font-size:9pt;
}
</style>
<table style="width:200;border:#cccccc 1 solid" id="TempTable">
<script>
for(i=0;i<20;i++)document.write("<tr><td style='border-left:5 solid #cccccc;background:#f4f4f4'>¡¡menu"+i+"</td></tr>");
</script>
</table>
<script>
function AddEvent(obj){
for(i=0;i<obj.document.all.tags("TD").length;i++){
var AdObj=obj.document.all.tags("TD")[i];
AdObj.onmouseover=new Function("this.style.background='fefefe';this.style.borderLeft='5 solid #ff9900'");
AdObj.onmouseout=new Function("this.style.background='f4f4f4';this.style.borderLeft='5 solid #cccccc'");
}
}
function window.onload(){
AddEvent(TempTable);
}
</script>
flashsoft2000 2002-09-26
  • 打赏
  • 举报
 回复
继续问，还有其他方法么，
另，原来我开始的写法就是对的了，但是我开始为什么不行，秋水你的就可以了呢
，好了，看了下一贴就打分
qiushuiwuhen 2002-09-26
  • 打赏
  • 举报
 回复
<style>
body,td,a{
font-size:9pt;
}
</style>
<table style="width:200;border:#cccccc 1 solid" id="TempTable">
<script>
for(i=0;i<20;i++)document.write("<tr><td style='border-left:5 solid #cccccc;background:#f4f4f4'>¡¡menu"+i+"</td></tr>");
</script>
</table>
<script>
function AddEvent(obj){
for(i=0;i<obj.document.all.tags("TD").length;i++){
var AdObj=obj.document.all.tags("TD")[i];
AdObj.onmouseover=new Function("this.style.background='fefefe';this.style.borderLeft='5 solid #ff9900'");
AdObj.onmouseout=new Function('setTimeout("'+AdObj.uniqueID+'.style.background=\'f4f4f4\';'+AdObj.uniqueID+'.style.borderLeft=\'5 solid #cccccc\'",100);') }
}
function window.onload(){
AddEvent(TempTable);
}
</script>

javascript经典特效---流动边框效果的表格.rar
// 延时设置，使得每个单元格依次变色 } } window.onload = function() { flowBorder(); // 页面加载完成后执行流动边框效果 }; ``` 在这个例子中，我们首先获取到表格及其所有单元格，然后遍历单元格并改变...
JavaScript动态添加表格行实战项目（含AJAX异步交互）
以下是三种主流定位方式的比较：定位方式示例优点缺点id定位最快，语义明确全局唯一，不利于复用class定位可复用，适合组件若多个匹配，需额外筛选data-*属性语义清晰，不影响样式需规范命名习惯推荐优先使用data-*...
网页编程的学习笔记
网页编程的学习笔记 一、JavaScript 二、ASP 一、JavaScript 0-1基本Html语言 ...一般情况下超链接打开的目标网页是在本网页之内打开的,但是利用上面的代码可以在新窗口中打开目标网页,再重新打开...
JavaScript DOM
一.什么是JavaScript DOM： ... 解释下面几个概念： ...文档对象模型：为了能够让程序中的JS去操作页面中的元素而定义的标准。把整个文档看成一棵树，数分枝就是节点，每个节点被定义为DOM节点，同时
个性化鼠标动画美化软件：星星与泡泡效果
没有正确安装或配置的驱动程序，硬件可能无法完全发挥其应有的性能，导致视觉效果美化失败或出现不稳定的情况。 3.1.2 驱动程序与硬件的交互机制 驱动程序的交互机制通常包含以下几个关键步骤： 1. 初始化： 驱动...
JavaScript

87,996

社区成员

224,693

社区内容

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章