回贴次数太多,csdn禁止继续回了,只好开一新贴。
http://www.csdn.net/Expert/TopicView1.asp?id=787545
---------------------------------------原贴内容-------------------------
每个做js的人最终都要遇上的经典问题
emu
1 最经典的:给file元素赋值,被浏览器禁止的
2 把select框放到别的元素后边,这是不行的,只能隐藏它
3 树图,例子已经有很多了,但是不停的还是有人问。比较经典的是孟版主的xml树,我老搞不懂;还有美洲豹的vml树,挺有创意
http://www.csdn.net/expert/topic/755/755042.xml?temp=.9006922
http://colorweb.go.163.com/CodeLib/XML/deeptree.htm
4 菜单,例子也够多了,被提起的频率也挺高
5 右键菜单。一般是用图层实现。孟版主手头的精彩例子挺多
6 元素拖动。我在无忧脚本上学的
7 不刷新页面提交数据或请求数据。可以用隐藏帧、xmlhttp、xmldom、tdc,还有今天刚学到的http://www.csdn.net/Expert/TopicView1.asp?id=786870,用script的src
8 访问其他框架的元素,这个最简单,上一层 parent.elementID,顶层 top.elementID,子帧 iframeName.elementID,或者 parent.document.elementName , top.document.elementName , iframeName.document.elementName
9 跨域访问子帧的元素?被禁止的。
10 打印网页。除了弹出新的窗口来print()之外还可以用IE6自带的控件,或者用孟版主的控件。
11 画图表。有孟版主介绍的asp.net方法,美洲豹的VML,当然也可以用mschart。
http://www.csdn.net/expert/topic/673/673156.xml?temp=.2439081
12 IE里面无穷无尽的BUG。连孟版主都在头疼。见
http://www.csdn.net/expert/topic/723/723655.xml?temp=.8577234
http://www.csdn.net/expert/topic/777/777047.xml?temp=.878628
http://www.csdn.net/expert/topic/774/774966.xml?temp=.3650019
-----------------------------------------------------------------
weidegong
2 iframe 可以放在select前边吧?
-----------------------------------------------------------------
weidegong
关于打开全屏窗口也很多人问:
<SCRIPT language="JavaScript">
function toFull(){
if(window.name=="fullscreen")return;
var a =window.open("","fullscreen","fullscreen=yes")
a.location = window.location.href
window.opener=null
window.close()
}
toFull();
</SCRIPT>
<html>
<body>
//在这儿填写具体内容
<input type=button value=关闭 οnclick=window.close()>
</body>
</html>
-----------------------------------------------------------------
weidegong
有些错误是潜在的,在使用某些语句之前应该先进行验证;或者把可能出错的语句放在try{}catch()finally{}中进行处理:这样才够严谨
-----------------------------------------------------------------
net_lover
把select框放到别的元素后边,只是IE的问题,在NS里,textarea有这样的问题
-----------------------------------------------------------------
Lostinet
我来补充-=句。(平时没有总结,现在想多少就写多少)
DHTML部分:
一,style是可以灵活应用的:div.mycomponent {mycomponentValue:111}
例如 a {isVisited:0} a.visited {isVisited:1} 那么可以这样判断一个A是否有历史记录了:elementA.currentStyle.isVisited?"yes":"no"
二,JScript的变量空间的应用。其中的对象释放规则很复杂。(我会新开一帖来描述变量空间的规则的)
我做了个例子(没有一个全局变量,全部用引用传递的):http://lostinet.dns2go.com/_temp/xmlhttp1/
http://lostinet.dns2go.com/Lostinet-Publish/JScriptSoapClient/ 完全是用这个搭建起来的
三,event.srcElement并不一定是关联事件的element问题。其实用JScript的变量空间可以搞定。或者用我的http://lostinet.dns2go.com/temp/public/delegate
直接的例子是:
e.attachEvent("onmouseover",Get_OnMouseOver(e));
function Get_OnMouseOver(element)
{
var func=function(event){
//这里可以直接用element,而且不会因为Get_OnMouseOver的再次调用而改变
}
return func;
}
四,怎样为一个element添加自己需要的信息?很多人都是element.myvalue=33其实这样不规范。如果有另外一个人也是这样,那就冲突了。
element.uniqueID是一个很特殊的变量。它总是唯一的。所以可以用来做哈稀表。
var coll=[];//当然coll的名字由人来定,所在的空间也由人来定,不会有冲突。
coll[element.uniqueID]={element:element,myvalue:33};
那样,element.myvalue就用coll[element.uniqueID].myvalue代替了。
(但是这样做,当使用removeNode等相关方法时,coll[]所引用的element是不会自动释放的。)
(element脱离document时,能自动触发事件的只有behavior的ondetach能做得到。)
五,window.execScript和eval有什么不同?window.execScript是全局的,eval是根据变量空间的规则的。
六,setTimeout真麻烦,不是吗?或者大家都是这样写setTimeout("document.getElementById('"+element.unqueID+"').style.color='red'",1000);
更加复杂的,就麻烦了。因为setTimeout是全局的。调用setTimeout的空间能使用的变量setTimeout后不一定能使用。
解决方法?和(三)是一样的。有兴趣看这个:
http://lostinet.dns2go.com/temp/public/delegate/
不过很可惜。比jscript5.5低的环境,很容易非法操作。(原因是有关系环的出现,脚本中的COM对象没有release)
如果觉得delegate不好理解,可以用(2)的变量空间的规则
7,累了。以后遇到就写。
编程思路:(虽然我写的东西很少人用,但是都是通用的,很好扩展的)
通用模型的编程模式。:现在很多JS都很依赖现成的Element,写一个菜单都没有好的扩充能力,例如要加个菜单项都要改很多脚本。相对好的方法是用<E οnmοuseοver=... οnmοuseοut=... 或者是用数组定义菜单的内容。
多人协作的代码处理。:这个我没有什么经验。JScript没有COM类似的规范,很多应用仍然停留在function的调用上。
异步操作的代码委托和封装。
看看http://lostinet.dns2go.com/_temp/xmlhttp1/就知道了。
实际上,无论写多少类似的调用,都是用很相似的形式的。
异步处理真的会想坏人的头。
http://lostinet.dns2go.com/Lostinet-Publish/JScriptSoapClient/
这个调用起来的代码真的很短。大部分都被封装了。但是没有解决异步问题。
(。。。我还没有完全想透)
实际上我很想能令DHTML程序能更加模块化。behavior很好,可是要做到互相关联却很难。
-----------------------------------------------------------------
emu
好,哈希表一段令我茅塞顿开。
setTimeout也是个谁都会碰到的问题。我一般事先给它准备好全局变量或者让它直接去调函数。
有一些长时间的计算操作我也会用setTimeout分开几个步骤做,在每个步骤结束的时候给一点提示并调用下一个步骤的setTimeout,看起来就不会觉得浏览器死掉了。不过具体写代码的时候也是挺麻烦。
有是也在想,其实用setTimeout在需要的时候都可以实现多线程了(我试过,但是计算速度变的奇慢无比,最后只好放弃,没有在小计算量的情形下试过)
异步操作的代码委托和封装?不明白。
我想动态的表格处理(增加、删除行、列,动态编辑内容并提交,排序)也差不多是个谁都得过的坎。
-----------------------------------------------------------------
Lostinet
TO:emu(ston):
》》有是也在想,其实用setTimeout在需要的时候都可以实现多线程了(我试过,但是计算速度变的奇慢无比,最后只好放弃,没有在小计算量的情形下试过)
我说的异步就是这个,实际上不是多线程。
》》有一些长时间的计算操作我也会用setTimeout分开几个步骤做,在每个步骤结束的时候给一点提示并调用下一个步骤的setTimeout,看起来就不会觉得浏览器死掉了。不过具体写代码的时候也是挺麻烦。
我说的异步的委托和封装,就是把功能和形式分开,
把形式都用一段代码来处理。
那样,异步处理的功能实现了,而具体是怎样实现的不用管,只需要知道能异步执行就可以了。
-----------------------------------------------------------------
Lostinet
所以,如果我写完了那个封转装的代码,那么setTimeout就不需要直接调用了。
不过真的很难写,我想了好多天了,
-------------------------------
最主要是,要顾及很多种情况,而我异步编程的经验还不足。
-----------------------------------------------------------------
emu
在jscript中动态写入一个隐藏帧来创造一个变量空间,在setTimeout或setInterval中需要引用的局部变量都放在隐藏帧里面,你看怎么样?
document.write("<div style='display:none'><iframe name='Vspace'></iframe></div>");
存数据的时候:
Vspace.variableName=parameter;
-----------------------------------------------------------------
Lostinet
可以。
但是对于IE来说,是C/S模式的远程调用。
-----------------------------------------------------------------
emu
》》但是对于IE来说,是C/S模式的远程调用
什么意思?
-----------------------------------------------------------------
Lostinet
:)
下载
http://lostinet.d2g.com/temp/public/runscript.zip
运行这个句:
var win=open("http://www.microsoft.com");
然后把新窗口关闭,
再运行这句:
alert(win.document.documentElement.outerHTML)
------------
实际上,跨窗口的变量调用很慢的。
------------------------------------------------
-----------------------------------------------------------------
emu
还有几个经典问题:
在网上看到一个效果不错,下回来以看是VBSCRIPT的,用JSCRIPT好象就是做不来(比如把confirm的焦点默认在取消上?),:-((
在书店看到一本书也不错,看一下封底:¥×××大元,:-((
在csdn发现一个网友有点意思,探究一下是GG还是JJ,却发现是个历史悬案,:-((
http://www.csdn.net/expert/topic/728/728382.xml?temp=.5561945
-----------------------------------------------------------------
chenzengxi
异步调用在WebService里面应用的可能比较广泛,可以同一时间对服务器进行多次访问,从而加速数据的提取速度。
还有我发现,在例如一个目录树里做全展开操作,同步递归的效果是完成才看到显示,异步递归的效果是看到一层层显示到全部,呵呵,很有意思。
还有关于字符串累加的讨论,其实是很实用的,我就有大量的这样应用:
http://www.csdn.net/expert/topic/752/752688.xml?temp=.1573297
还有不知道算不算IE6的BUG一个:
http://www.csdn.net/expert/topic/724/724539.xml?temp=6.451052E-02
-----------------------------------------------------------------
chenzengxi
HTA(HTML Applications),是个挺好的东西,HTML应用程序,不过我发现限制蛮多的,还要有IE的支持才能运行.
http://msdn.microsoft.com/library/default.asp?url=/workshop/author/hta/reference/objects/hta.asp
不知道那有详细的中文资料呀?
-----------------------------------------------------------------
Lostinet
>>>>在网上看到一个效果不错,下回来以看是VBSCRIPT的,用JSCRIPT好象就是做不来(比如把confirm的焦点默认在取消上?),:-((
那个是VBS提供的内置函数,起源于VB。
JScript是没有提供这个的。
>>>>>还有我发现,在例如一个目录树里做全展开操作,同步递归的效果是完成才看到显示,异步递归的效果是看到一层层显示到全部,呵呵,很有意思。
异步问题如果是简单的还好,例如,整个过程都只是一个完整的程序进行,没有任何打扰。
但是经常遇到的问题是,过程到了一般,可能要求返回,或者取消,或者要求把整个对象系都要删除。
(例如展开了一个菜单。但是用户由立刻把它关闭。)
处理这些突法事件很麻烦。对象必须能够自主地完成这些取消的工作。
不同的异步模块还要定一个协议,说明现在是否能取消,情况怎样等等。
这在DHTML下却是很麻烦的事情。
-----------------------------------------------------------------
Lostinet
HTA(HTML Applications),没有什么好说明的。
你只需要知道,它的权限很大就够了。
在HTA,可以访问任何域名下的资源,和本地资源。
--------------
MICROSOFT。NET的更新程序也是用HTA来做框架的。
-----------------------------------------------------------------
Lostinet
对于前面的更正
parseInt(elementA.currentStyle.isVisited)?"yes":"no"
-----------------------------------------------------------------
chenzengxi
to Lostinet
你说的问题,还确实是个问题,那是最严谨的做法,虽然操作者可能永远都不会这样操作,谢谢你提醒。
-----------------------------------------------------------------
chenzengxi
Lostinet兄能不能写个HTA对Access的增删改的例子。
-----------------------------------------------------------------
chenzengxi
我另开一个贴子吧,呵呵。
-----------------------------------------------------------------
emu
早该如此了,我这个帖子早已跑题了。
-----------------------------------------------------------------
Lostinet
讨论无边界嘛。何必拘谨于形式呢。。
:)
-----------------------------------------------------------------
Lostinet
讨论无边界嘛。何必拘谨于形式呢。。
:)
-----------------------------------------------------------------
emu
我的本意一方面是想让后来者知道他们有哪些坎要过,一方面想从高手那里知道自己还有那些坎要过。跑题了就达不到原来的目的了。
-----------------------------------------------------------------
qiushuiwuhen
跑得好,最好永不结贴,永远跑下去,让大家都来关注和收藏....
地球是圆的,只要有恒心,南辕北辙都行
-----------------------------------------------------------------
linhaibo
写 HTC 吧...
模仿 Delphi 里面的控件.
HTC思路很好,速度却不能叫人满意(可能是我的写法问题). :(
-----------------------------------------------------------------
linhaibo
浏览器和应用程序的交互也是个问题.
类似QQ聊天室的操作就是比较成功的例子
他们把捕获浏览器的页面跳转事件带来的参数 传递给 应用程序.
应用程序通过 IE 控件可以再直接修改网页内容.
我想,应用程序向“半Web页”方面转换也是个趋势
固定部分用应用程序完成,其他的都可以用 网页来实现。
-----------------------------------------------------------------
emu
这算哈希表吗?
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title></title>
</head>
<body>
<SCRIPT LANGUAGE="JavaScript">
<!--
var ar = new Array();
ar["abc"] = "123";
ar["def"] = "456";
alert(ar["abc"]);
alert(ar["def"]);
//-->
</SCRIPT>
</body>
</html>
在秋水发给我的东西里面发现的用法。如果是哈希表,怎么遍历它呢?
-----------------------------------------------------------------
emu
哦,这么遍历:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title></title>
</head>
<body>
<SCRIPT LANGUAGE="JavaScript">
<!--
var ar = new Array();
ar["abc"] = "123";
ar["def"] = "456";
for (a in ar)
alert(a+":"+ar[a])
//-->
</SCRIPT>
</body>
</html>
今天又学到一招,谢谢秋水。
-----------------------------------------------------------------
emu
每个程序员都要过这几道关口:
程序写好了,忘存就把窗口关了,更该死的是还按了确定!
程序保存了,但是不小心删了,更该死的是顺手清了回收站(有些初学者不知从哪学来的坏习惯,还有用惯了苹果电脑的家伙们也是)
程序保存了,没有不小心删了,只是从vss上get了一个旧的lastestVersion吧它replace了(唉,我昨晚干的好事就是)。
没有进行任何误操作,只是硬盘忽然就罢工了,拿去维修时还被告知无法恢复数据(我打赌十有八九是IBM的,这两年的IBM硬盘听说都是国产的,据说产地就是深圳,不但爱罢工,而且压根恢复不了数据,现在已排为最低性价比硬盘了,使用IBM硬盘的诸位赶快刻光盘罢)
硬盘没坏,只是机器忽然掉电了,scandisk(chkdsk?fsck?)时报了点儿错(天,早说了不要用FAT和EXT2了)。
什么坏事也没干,系统崩溃了。
-----------------------------------------------------------------
emu
新问题:计算误差问题,我今天碰上了。看看秋水写的例子:
<script>
for(s=2;s<=10;s++){
var c=0;
for(n=1;n<100;n++)
for(p=1;p<=100000;p*=s){
t=n/(n/p)
if(p!=t)document.write((++c)+"."+n+"/"+p+"="+t+"<br>")
}
document.write(s+" is over:"+c+"<br>")
}
</script>
-----------------------------------------------------------------
Lostinet
计算误差是语言问题,,。。。
-----------------------------------------------------------------
emu
http://www.csdn.net/expert/topic/789/789880.xml?temp=.7990534
-----------------------------------------------------------------
emu
关于树图的补充:孟版主的xml树图现在可以下载了,挺有意思的,大家来看呐:
http://lucky.myrice.com/temp/XML.zip
或
http://colorweb.go.163.com/temp/XML.zip
或
http://go2.163.com/stonelf/tools/deeptree1.zip
-----------------------------------------------------------------
emu
新发现:IE5的数组越界bug:
<html>
<body>
<SCRIPT>
ar = []
try
{
ar.length--
}
catch (e)
{
alert(e.message)
}
alert("数组长度:"+ar.length)
</SCRIPT>
</body>
</html>
在IE6下正常
-----------------------------------------------------------------
Lostinet
应该是这样把:
JScript5.0(IE5.0)下
arrayInstance.length是只读的。。
JScript5.5(IE6.0)下
arrayInstance.length=arrayInstance.length-1
的时候arrayInstance.length已经是新的属性了。
-----------------------------------------------------------------
emu
to Lostinet([思考太多]~[走火入魔]) :
Array 的length属性不是只读的。因为Array.pop()要到javascript1.2+才开始支持,所以在IE5下面,我都只能用Array.length--来实现pop元素。
-----------------------------------------------------------------
emu
呵呵,没有星星的,不许蒙emu!
-----------------------------------------------------------------
xg_delayth
提一个看看大家是否注意过的bug
用showModelDialog打开一个只有一个控件的页面时(如只有<input type=text name=test value="测 试">)在输入框中回车有什么结果。
在IE5.5和IE6.0中有
-----------------------------------------------------------------
bcboy
这么多高手!!!
占个位,问个水问题:
有没有办法修改web ser
-----------------------------------------------------------------
nature123
对不起高手们问个问题第一个帖子中的“ 把select框放到别的元素后边,这是不行的,只能隐藏它”这句什么意思
-----------------------------------------------------------------
emu
我们在网页上面可以把元素一个个的堆砌上去,也可以用table来把它们框在指定的位置,还可以通过style对象进行绝对定位,把元素想放哪就放哪:
<html>
<body>
<span style="position:absolute;top:100;left:100"><input value="aaaaaaaaaaaaaaa"></span>
<span style="position:absolute;top:200;left:150"><input value="bbbbbbbbbbb"></span>
</body>
</html>
这个特性有时也可以用来移动元素:
<html>
<body>
<span style="position:absolute;top:100;left:100" id=span1><input value="aaaaaaaaaaaaaaa"></span>
<span style="position:absolute;top:200;left:80" id=span2><input value="bbbbbbbbbbbbbbb"></span>
</body>
<SCRIPT LANGUAGE="JavaScript">
<!--
setInterval("move()",30)
var direction = 10;
function move()
{
var t = parseInt(span1.style.top);
if (t>300) direction = -10;
if (t<100) direction = 10;
span1.style.top =(t+direction)
}
//-->
</SCRIPT>
</html>
但是在随意定位或者移动的时候它们有可能就会重叠到。这个时候我们可能就需要定义谁在谁的上面。一般我们可以通过style对象的zIndex属性来舍得谁在前面(整数值,值越大的越靠前):
<html>
<body>
<span style="position:absolute;top:100;left:100" id=span1><input value="aaaaaaaaaaaaaaa"></span>
<span style="position:absolute;top:200;left:80" id=span2><input value="bbbbbbbbbbbbbbb"></span>
</body>
<SCRIPT LANGUAGE="JavaScript">
<!--
setInterval("move()",30)
var direction = 3;
function move()
{
var t = parseInt(span1.style.top);
if (t>300) direction = -3;
if (t<100) direction = 3;
span1.style.top =(t+direction) ;//移动元素
span1.style.zIndex = direction ;//设定它的层
}
//-->
</SCRIPT>
</html>
但是select元素毕竟古怪,它不肯躲在别人背后的:
<html>
<body>
<span style="position:absolute;top:100;left:100" id=span1><input value="aaaaaaaaaaaaaaa"></span>
<span style="position:absolute;top:200;left:80" id=span2><select><option>bbbbbbbbbbbbb</option></select></span>
</body>
<SCRIPT LANGUAGE="JavaScript">
<!--
setInterval("move()",30)
var direction = 3;
function move()
{
var t = parseInt(span1.style.top);
if (t>300) direction = -3;
if (t<100) direction = 3;
span1.style.top =(t+direction) ;//移动元素
span1.style.zIndex = direction ;//设定它的层
}
//-->
</SCRIPT>
</html>
这就是我在前面说的意思了。
当然也不是绝对不行,听说有一些网站上可以做到的。它们经常让广告窗口从select上面越过。我还没时间去分析出来它的原理。以前我们一般是把它隐藏起来,在原位置显示一个input的。
<html>
<body>
<span style="position:absolute;top:200;left:80" id=span2 οnmοuseοver="this.firstChild.style.display='block' ; this.children[1].style.display='none' " οnmοuseοut="this.firstChild.style.display='none' ; this.children[1].style.display='block' ">
<select style="display:none"><option>bbbbbbbbbbbbb</option></select>
<input value="bbbbbbbbbbbbbbbb" size=15>
</span>
<span style="position:absolute;top:100;left:100" id=span1><input value="aaaaaaaaaaaaaaa"></span>
</body>
<SCRIPT LANGUAGE="JavaScript">
<!--
setInterval("move()",30)
var direction = 3;
function move()
{
var t = parseInt(span1.style.top);
if (t>300) direction = -3;
if (t<100) direction = 3;
span1.style.top =(t+direction) ;//移动元素
}
//-->
</SCRIPT>
</html>
-----------------------------------------------------------------------
nature123
一说我明白了,我常遇到的select的预先级是很高,它都可以跃出页面:)
有时是不方便,但有时这个特性还很有用,比如下边是个大activex,别的菜单都盖不住它,可select可以:)
-----------------------------------------------------------------------
chenzengxi
呵呵,昨天发现的一个css小问题,搞了我半天,今天才知道怎么回事。
如果css是存在一个文件里的,当里面用相对路径时,应该用的是相对于这个css文件的路径,和调用它的文件无关,比如:
-- css.css (css/css.css) --
background-image:url(../images/buttonbg.gif);
我昨天犯的就是:
background-image:url(images/buttonbg.gif);
因为调用它的文件(index.htm)在根目录,图片在images里,搞了半天就是没效果,今天睡醒了,加了两个../就好了,呵呵.
也是一个老问题了。我现在一般都让所有图片、js、css等引用的地址都写为相对于发布目录的("/jsp/images...")。因为如果通过servlet把连接转向了,相对地址的计算就会出错。
为了处理上面的帖子,刚刚又写了一个js小程序来替换特殊字符(大于号、小于号、回车、制表符),也许对别人也有用。
function String.prototype.change()
{
var str = this;
while (str.indexOf("<") >= 0)
str = str.replace("<","<");
while (str.indexOf(">") >= 0)
str = str.replace(">",">");
while (str.indexOf("/n") >= 0)
str = str.replace("/n","<br>");
while (str.indexOf(" ") >= 0)
str = str.replace(" "," ");
while (str.indexOf("/t") >= 0)
str = str.replace("/t"," ");
return (str);
}
用法:document.write("<script>alert()</script>".change())
上面的帖子就是这么处理出来的。
哈哈,自己给自己回帖,我帮你UP一下,继续贴:)
我现在回贴要谨慎,超过30个就不能再回了。
天,想不通干嘛要做这样的限制,明显只限制到那些不该被限制的帖子嘛。要是一个帖子一个人回了30次还在回,肯定是在讨论一些有意思的东西了,干嘛不让人把话说完呢?
顺便贴一点代码上来,回一次就少一次了啊!
嗯,以后长的代码就不直接贴上来了,我找个地方上传了,再把连接贴过来,这样帖子才不会快高长大。就贴一个一行的函数上来吧:
function String.prototype.trim(){return this.replace(/(^/s*)|(/s*$)/g, "");}
这是javascript板的trim()函数,去除前后空格。用法也直接:
alert(" abc ".trim());
http://search.csdn.net/Expert/topic/806/806790.xml?temp=.787545