最近的文章列表

ajax问题总结
在看文章前,先指定一个变量xhr,xhr代表ajax对象。测试浏览器:ie为ie6,firefox为2,其他的未测试。统称ie6为ie,firefox2为ff。基本的============================================1,最经典的就是ie下的缓存问题了。如果使用的是get,那么在ie下出现缓存问题。导致代码只执行一次。解决办法就是加时间戳或者随机数,使url变为唯一,这样就不会出现ie下的缓存问题了,或者改为post提交。xhr.open("get","xxxx.aspx?_dc="+new Date().getTime(),true);2,ajax对象属性的大小写问题,ajax对象常用属性,事件,方法大小写问题在w
2011/9/14 Comments:
Google电吉他扩展版——可智能识别曲谱
var runcode={};runcode.open_new=function(element){var code = document.getElementById(element).value;var win = window.open("", "", "");win.opener = null;win.document.write(code);win.document.close();}runcode.copy=function(element){var codeobj = document.getElementById(element) ;if (window.clipboardData){ window.clipboar
2011/9/5 Comments:
让 Raphael 的 Path 动起来
Raphaël 是一个很实用的线上矢量图操作 Javascript 库。使用简单,一个值得一提的卖点是通过抽象出共同的接口屏蔽了 SVG 和 VML 之间的差异,做到了对主流浏览器的支持,包括很不给力的 IE6。(很可惜,并不支持手机 UC 浏览器)Raphael 对于交互事件也有一定的支持,比如常用的鼠标的拖放操作(Drag and Drop)。在官方网站上也有拖放操作的例子。可惜的是,官方的这个例子的写法只对 Circle,Rect 等有效,但对于 Path 却不起作用。经过一番实践,终于了解了 Raphaël 对于拖放支持的原理,想出了一个通用的拖放操作的写法,支持所有的 Raphael 矢量对象,包括 path。官方例子之所以不能让 Path 动起
2011/9/5 Comments:
jQuery中ajax的使用和缓存问题解决
1:GET访问 浏览器 认为 是等幂的就是 一个相同的URL 只有一个结果[相同是指 整个URL字符串完全匹配]所以 第二次访问的时候 如果 URL字符串没变化 浏览器是 直接拿出了第一次访问的结果POST则 认为是一个 变动性 访问 (浏览器 认为 POST的提交 必定是 有改变的)防止 GET 的 等幂 访问 就在URL后面加上 ?+new Date();,[总之就是使每次访问的URL字符串不一样的]设计WEB页面的时候 也应该遵守这个原则2:一.谈Ajax的Get和Post的区别Get方式:用get方式可传送简单数据,但大小一般限制在1KB下,数据追加到url中发送(http的header传送),也就是说,浏览器将各个表单字段元素及其数据按照URL参数的格式附加在请求行中的资源路径后面
2011/9/5 Comments:
Raphael js库简介-SVG/VML+JS实现跨浏览器的矢量图形实现方案
Raphael JS库是果然很强大通过SVG/VML+JS实现跨浏览器的矢量图形实现方案。这其实和cufon等网络字体的实现原理是有些类似的:非IE浏览器使用SVG绘图,然后IE中使用VML。它的目的是想要提供一种简单易用的真正跨浏览器的矢量图形实现方案,包括一些动画效果。Raphael的语法也很简单,基本上了解SVG就会很容易上手的:var c = paper.path("M10 10L90 90");// 画一条线;浏览器支持IE6+、Firefox 3.0+、chrome、opera等都是很好支持的。一些酷酷的例子:使用Raphael绘制的117个矢量图标: >repath}articles/common/upload/2011/08/30/134353vn.
2011/8/30 Comments:
document.documentElement 与 document.body 的 scrollW
这是一个很复杂的问题,让我们想像一下:document.documentElement.scrollWidthdocument.documentElement.offsetWidthdocument.documentElement.clientWidthdocument.body.scrollWidthdocument.body.offsetWidthdocument.body.clientWidth有 6 个属性要测,这 6 个属性要放在 4 种情况中:没有指定 DOCTYPE,网页内容没有超过窗口宽度;没有指定 DOCTYPE,网页内容超过窗口宽度;指定 DOCTYPE,网页内容没有超过窗口宽度;指定 DOCTYPE,网页内容超过窗口宽度;然后这 4 种情况要放到几个主流浏览器中,假设只
2011/8/18 Comments:
水平无间隙循环滚动区域代码
实现上述效果的代码如下: <div id=demo style="OVERFLOW: hidden; WIDTH: 580px; align: center"> <table border="0" align="center" cellpadding="0" cellspacing="1" bgcolor="#ECE9D8"> <tbody> <tr bgcolor="#FFFFFF"> <td valign="top" id="marquePic1
2011/8/9 Comments:
js 鼠标滚轮(滑轮)事件捕捉
判断滚轮向上或向下在浏览器中也要考虑兼容性,现在五大浏览器(IE、Opera、Safari、Firefox、Chrome)中Firefox 使用detail,其余四类使用wheelDelta;两者只在取值上不一致,代表含义一致,detail与wheelDelta只各取两个值,detail只取&plusmn;3,wheelDelta只取&plusmn;120,其中正数表示为向上,负数表示向下。<script type="text/javascript">var scrollFunc=function(e){var direct=0;e=e || window.event;if(e.wheelDelta){//IE/Opera/Chrome use
2011/8/9 Comments:
offsetLeft,scrollLeft,offsetTop,scrollTop,clientX,
clientX 设置或获取鼠标指针位置相对于当前窗口的 x 坐标,其中客户区域不包括窗口自身的控件和滚动条。 clientY 设置或获取鼠标指针位置相对于当前窗口的 y 坐标,其中客户区域不包括窗口自身的控件和滚动条。 offsetX 设置或获取鼠标指针位置相对于触发事件的对象的 x 坐标。 offsetY 设置或获取鼠标指针位置相对于触发事件的对象的 y 坐标。 screenX 设置或获取获取鼠标指针位置相对于用户屏幕的 x 坐标。 screenY 设置或获取鼠标指针位置相对于用户屏幕的 y 坐标。 x 设置或获取鼠标指针位置相对于父文档的 x 像素坐标(亦即相对于当前窗口)。 y 设置或获取鼠标指针位置相对于父文档的 y 像素坐标(亦即相对于当前窗口)。实验实例(来源于网络,修改过):
2011/8/2 Comments:
js使用onpropertychange,oninput事件解决onchange事件的不足
用onpropertychange,oninput事件解决onchange事件的不足,需要的朋友可以参考下。onchange在用于文本框输入框时,有一个明显的不足. 事件不会随着文字的输入而触发,而是等到文本框失去焦点(onblur)时才会触发. 也就是没有即时性!在IE下,可以用onpropertychange来代替onchange事件,当文本框有任何变化时,能立即触发此事件.这样一来问题就解决了.那其他浏览器呢,onpropertychange可是IE的专利. 接下来就是oninput事件了.但是oninput有个诡异,必须用addEventListener的方式来绑定事件.否则无效.好了, 以下是演示例子, 主流浏览器都没问题:<!DOCTYPE html PUBLIC &quo
2011/7/26 Comments: