- 博客(0)
- 资源 (16)
- 问答 (2)
- 收藏
- 关注
jQueryAPI 1.4.1
jQueryAPI 1.4.1
jQuery 核心函数
jQuery(expr, [context])
jQuery(html, [ownerDoc])
jQuery(html, props)
jQuery(elements)
jQuery()
jQuery(callback)
jQuery 对象访问
each(callback)
size()
length
selector
context
get()
get(index)
index(subject)
数据缓存
data([name] , [value])
data(obj)
removeData(name)
$.data([el], [key], [val])
队列控制
queue(name ,[cb|queue])
dequeue(name)
clearQueue([queueName])
插件机制
jQuery.fn.extend(object)
jQuery.extend(object)
多库共存
jQuery.noConflict([ex])
属性
属性
attr(name)
attr(properties)
attr(key, value)
attr(key, fn)
removeAttr(name)
CSS 类
addClass(class | fn)
removeClass([class | fn])
toggleClass(class|fn [, sw])
HTML代码/文本/值
html( [val | fn] )
text( [val | fn] )
val( [val | fn | arr] )
CSS
CSS
css(name)
css(properties)
css(name, value | fn)
位置
offset([coordinates])
position()
scrollTop( [val] )
scrollLeft( [val] )
尺寸
height( [val] )
width( [val] )
innerHeight()
innerWidth()
outerHeight(options)
outerWidth(options)
选择器
基本
#id
element
.class
*
selector1,selector2,selectorN
层级
ancestor descendant
parent > child
prev + next
prev ~ siblings
基本
:first
:last
:not
:even
:odd
:eq
:gt
:lt
:header
:animated
内容
:contains
:empty
:has
:parent
可见性
:hidden
:visible
属性
[attribute]
[attribute=value]
[attribute!=value]
[attribute^=value]
[attribute$=value]
[attribute*=value]
[attrSel1][attrSel2][attrSelN]
子元素
:nth-child
:first-child
:last-child
:only-child
表单
:input
:text
:password
:radio
:checkbox
:submit
:image
:reset
:button
:file
:hidden
表单对象属性
:enabled
:disabled
:checked
:selected
文档处理
内部插入
append(content | fn)
appendTo(content)
prepend(content | fn)
prependTo(content)
外部插入
after(content | fn)
before(content | fn)
insertAfter(content)
insertBefore(content)
包裹
wrap(html)
wrap(elem)
wrap(fn)
unwrap()
wrapAll(html)
wrapAll(elem)
wrapInner(html)
wrapInner(elem)
wrapInner(fn)
替换
replaceWith(content)
replaceAll(selector)
删除
empty()
remove([expr])
detach([expr])
复制
clone()
clone(true)
筛选
过滤
eq(index)
first()
last()
hasClass(class)
filter(expr | fn)
is(expr)
map(callback)
has(expr)
not(expr)
slice(start, [end])
查找
children([expr])
closest([expr])
find(expr)
next([expr])
nextAll([expr])
nextUntil([expr])
offsetParent()
parent([expr])
parents([expr])
parentsUntil([expr])
prev([expr])
prevAll([expr])
prevUntil([expr])
siblings([expr])
串联
add(expr, [context])
andSelf()
contents()
end()
事件
页面载入
ready(fn)
事件处理
bind(type, [data], fn)
one(type, [data], fn)
trigger(type, [data])
triggerHandler(type, [data])
unbind([type], [data])
事件委派
live(type, [data], fn)
die([type], [fn])
事件切换
hover(over, out)
toggle(fn, fn2, [fn3, fn4, ...])
事件
blur( [fn] )
change( [fn] )
click( [fn] )
dblclick( [fn] )
error( [fn] )
focus( [fn] )
focusin( [fn] )
focusout( [fn] )
keydown( [fn] )
keypress( [fn] )
keyup( [fn] )
mousedown(fn)
mousemove(fn)
mouseout(fn)
mouseover(fn)
mouseup(fn)
resize(fn)
scroll(fn)
select( [fn] )
submit( [fn] )
unload(fn)
效果
基本
show()
show(speed, [callback])
hide()
hide(speed, [callback])
toggle()
toggle(switch)
toggle(speed, [callback])
滑动
slideDown(speed, [callback])
slideUp(speed, [callback])
slideToggle(speed, [callback])
淡入淡出
fadeIn(speed, [callback])
fadeOut(speed, [callback])
fadeTo(speed, opacity, [fn])
自定义
animate(param,[dur],[e],[fn])
animate(params, options)
stop([clearQueue], [gotoEnd])
delay(duration, [queueName])
设置
jQuery.fx.off
Ajax
Ajax 请求
$.ajax([options])
load(url, [data], [callback])
$.get(url, [data], [fn], [type])
$.getJSON(url, [data], [fn])
$.getScript(url, [callback])
$.post(url, [data], [fn], [type])
Ajax 事件
ajaxComplete(callback)
ajaxError(callback)
ajaxSend(callback)
ajaxStart(callback)
ajaxStop(callback)
ajaxSuccess(callback)
其它
$.ajaxSetup([options])
serialize()
serializeArray()
工具
浏览器及特性检测
$.support
$.browser
$.browser.version
$.boxModel
数组和对象操作
$.each(object, [callback])
$.extend([d],tgt,obj1,[objN])
$.grep(array, fn, [invert])
$.makeArray(obj)
$.map(array, callback)
$.inArray(value, array)
$.toArray()
$.merge(first, second)
$.unique(array)
$.parseJSON(json)
函数操作
$.noop
$.proxy(function, scope)
测试操作
$.contains(container, contained)
$.isArray(obj)
$.isFunction(obj)
$.isEmptyObject(obj)
$.isPlainObject(obj)
字符串操作
$.trim(str)
URL
$.param(obj, [traditional])
插件编写
$.error(message)
关于
关于jQuery 1.3 版翻译
关于jQuery 1.2 版翻译
提交bug及获取更新
2010-11-04
上传图片预览java代码
图片上传预览是一种在图片上传之前对图片进行本地预览的技术。
使用户选择图片后能立即查看图片,而不需上传服务器,提高用户体验。
但随着浏览器安全性的提高,要实现图片上传预览也越来越困难。
不过群众的智慧是无限的,网上已经有很多变通或先进的方法来实现。
例如ie7/ie8的滤镜预览法,firefox 3的getAsDataURL方法。
但在opera、safari和chrome还是没有办法实现本地预览,只能通过后台来支持预览。
兼容:ie6/7/8, firefox 3.5.5
后台支持下还兼容:opera 10.10, safari 4.0.4, chrome 3.0
程序说明
【基本原理】
图片预览主要包括两个部分:从file表单控件获取图像数据,根据数据显示预览图像。
程序的file和img属性就是用来保存file控件和显示预览图像的容器的,而img还必须是img元素。
程序有以下几种预览方式:
simple模式:直接从file的value获取图片路径来显示预览,适用于ie6;
filter模式:通过selection获取file的图片路径,再用滤镜来显示预览,适用于ie7/8;
domfile模式:调用file的getAsDataURL方法获取Data URI数据来显示预览,适用于ff3;
remote模式:最后的办法,把file提交后台处理后返回图片数据来显示预览,全适用。
程序定义时就自动根据浏览器设置MODE属性:
ImagePreview.MODE = $$B.ie7 || $$B.ie8 ? "filter" :
$$B.firefox ? "domfile" :
$$B.opera || $$B.chrome || $$B.safari ? "remote" : "simple";
如果用能力检测会比较麻烦,所以只用了浏览器检测。
由于浏览器对应的默认模式是不会变的,这个值会保存到函数属性中作为公用属性。
ps:ie6也可以用filter模式,不过它有更好的simple模式。
【获取数据】
调用preview方法,就会执行预览程序:
if ( this.file && false !== this.onCheck() ) {
this._preview( this._getData() );
}
在通过检测后,再调用_getData获取数据,并作为_preview的参数进入下一步。
程序初始化时就会根据mode来设置_getData数据获取程序:
this._getData = this._getDataFun(opt.mode);
mode的默认值是ImagePreview.MODE,也可以在可选参数中自定义。
由于兼容性问题,一般应保留默认值,除非是使用全兼容的remote模式。
在_getDataFun里面,根据mode返回数据获取程序:
代码
switch (mode) {
case "filter" :
return this._filterData;
case "domfile" :
return this._domfileData;
case "remote" :
return this._remoteData;
case "simple" :
default :
return this._simpleData;
}
不同的模式有不同的数据获取程序:
滤镜数据获取程序:
this.file.select();
try{
return document.selection.createRange().text;
} finally { document.selection.empty(); }
一般用在ie7/8,在file控件select后再通过selection对象获得文件本地路径。
此时file控件不能隐藏,否则不能被select,不过一般能选择文件就肯定能被select了。
确实要隐藏也可以在获取数据之后再隐藏。
domfile数据获取程序:
return this.file.files[0].getAsDataURL();
用getAsDataURL从file控件获取数据,这个方法暂时只有ff3支持。
远程数据获取程序:
this._setUpload();
this._upload && this._upload.upload();
用_upload上传文件对象把数据提交后台,根据返回的数据再显示。
这个方法不属于本地预览,是没有办法中的办法。
一般数据获取程序:
return this.file.value;
最原始的方法,现在只有ie6还支持从file的value直接获取本地路径。
获取数据后,作为_preview预览程序的参数,再进行处理:
if ( !!data && data !== this._data ) {
this._data = data; this._show();
}
首先排除空值或相同值的情况,再执行_show程序进行显示预览,其中_data属性用来保存当前的图片数据。
图片使用Data URI数据时可能会设置一个很大的src值,在ie8获取很大的src值会出现“无效指针”的错误。
使用_data属性保存这个值可以避免从src取值而触发这个错误。
远程数据获取程序没有返回值,因为它需要等待返回数据,在_preview中会自动排除。
【显示预览】
程序初始化时就会根据mode来设置_show预览显示程序:
this._show = opt.mode !== "filter" ? this._simpleShow : this._filterShow;
除了filter模式,都是使用_simpleShow显示程序来显示预览图片的。
里面会先调用_simplePreload方法设置一般预载图片对象:
代码
if ( !this._preload ) {
var preload = this._preload = new Image(), oThis = this,
onload = function(){ oThis._imgShow( oThis._data, this.width, this.height ); };
this._onload = function(){ this.onload = null; onload.call(this); }
preload.onload = $$B.ie ? this._onload : onload;
preload.onerror = function(){ oThis._error(); };
} else if ( $$B.ie ) {
this._preload.onload = this._onload;
}
预载图片对象保存在_preload属性中,主要用来判断图像能否加载成功并获取图片原始尺寸。
要实现这些功能使用Image对象就足够了。
在onload中执行_imgShow显示预览,在onerror中进行出错处理。
ps:ff、chrome和safari的图片对象还有naturalHeight和naturalWidth属性可以获取图片的原始尺寸,即使图片尺寸已经修改过。
这里要注意ie6/7的gif图片载入bug,测试以下代码:
代码
<!DOCTYPE html><body><img id="img" /><div id="div"></div></body>
<script>
img.onload = function(){ div.innerHTML += this.complete + ", "; };
img.src = "http://tuan.pcpop.com/image/my/loading.gif";
</script>
一般图片执行一次onload后并不会重复执行,但ie6/7的gif每次循环播放都会执行一次onload。
ps:ie8在非标准(怪辟)模式下也有相同的问题。
可以在onload的时候,判断complete是否为false来判断是否重复加载。
ps:除了ie,其他浏览器在onload时complete就已经为true了。
问题是选择另一个图片时这个complete仍然是true,这样就没有意义了。
所以只好在onload里面重置onload为null,并在每次选择文件重设onload了。
然后设置_preload的src预载图片,如果成功预载就会执行_imgShow显示预览。
要注意src的设置要在onload/onerror的设置之后,否则设置之前就加载完成的话就触发不了事件了。
_imgShow需要三个参数,包括要预览图片的src值,图片原始宽度和图片原始高度。
在_imgShow里面首先设置预览图片的尺寸:
代码
var img = this.img, style = img.style,
ratio = Math.max( 0, this.ratio ) || Math.min( 1,
Math.max( 0, this.maxWidth ) / width || 1,
Math.max( 0, this.maxHeight ) / height || 1
);
style.width = Math.round( width * ratio ) + "px";
style.height = Math.round( height * ratio ) + "px";
这里的关键是获取ratio比例值,如果自定义的ratio大于0就直接使用自定义的比例,否则就根据参数自动计算。
自动计算首先要确保maxWidth最大宽度和maxHeight最大高度大于等于0。
然后分别跟原始宽高做“/”运算得到比例,如果比例为0表示不限制,那么比例就自动改为1。
最后取比较小的比例来计算,程序设定了比例最大值为1,这样就不会自动放大图片了。
当然比例的计算可以根据需要自行修改。
ps:style的优先级比属性(width/height)高,所以要用style设置。
最后设置img的src就可以实现预览了。
【remote模式】
remote模式会先提交file控件到后台,通过返回的数据来显示图片。
它跟其他模式最大的区别就是获取数据的部分。
在_remoteData远程数据获取程序中,会调用_setUpload来设置上传文件对象。
如果设置了action,并存在QuickUpload函数,就会实例化一个上传文件对象保存到_upload中:
代码
var oThis = this;
this._upload = new QuickUpload(this.file, {
onReady: function(){
this.action = oThis.action; this.timeout = oThis.timeout;
var parameter = this.parameter;
parameter.ratio = oThis.ratio;
parameter.width = oThis.maxWidth;
parameter.height = oThis.maxHeight;
},
onFinish: function(iframe){
try{
oThis._preview( iframe.contentWindow.document.body.innerHTML );
}catch(e){ oThis._error("remote error"); }
},
onTimeout: function(){ oThis._error("timeout error"); }
});
这里使用的QuickUpload就是简便无刷新文件上传程序。
在onReady中设置参数,在onFinish中处理返回数据,onTimeout进行出错处理。
返回的数据可以是图片的地址或对应的Data URI数据,然后给_preview处理。
当然针对不同的后台输出,数据处理的方式也不同,可以按照需要修改。
后台最好先根据传递的参数缩小图片,尽量减少返回数据来提高预览速度。
【filter模式】
filter模式在_filterData程序中得到文件本地路径,但ie7/8都不允许直接使用本地路径显示图片。
不过还是可以通过滤镜,用本地路径来做预览图片效果。
filter模式使用_filterShow方法来显示预览图片。
里面先调用_filterPreload方法来设置滤镜预载图片对象。
跟一般预载图片对象不同,滤镜预载对象是用滤镜来显示图片,所以并不一定要图像元素。
程序就使用了div元素作为滤镜预载对象:
代码
var preload = this._preload = document.createElement("div");
$$D.setStyle( preload, {
width: "1px", height: "1px",
visibility: "hidden", position: "absolute", left: "-9999px", top: "-9999px",
filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image')"
});
var body = document.body; body.insertBefore( preload, body.childNodes[0] );
在样式设置中隐藏元素并添加滤镜,要使滤镜生效width和height必须设置一个值。
由于要获取尺寸,只能用visibility来隐藏并插入body,关于AlphaImageLoader滤镜后面再介绍。
然后在_filterShow中预载图片:
try{
preload.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = data;
}catch(e){ this._error("filter error"); return; }
成功的话,再给img载入图片:
this.img.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale',src=\"" + data + "\")";
注意,如果路径中有“)”,“%”这类字符的话,直接拼接到滤镜字符串中会出现类似sql注入的问题。
程序会先对这些敏感字符进行escape编码:
data = this._data.replace(/[)'"%]/g, function(s){ return escape(escape(s)); });
为什么要做两次escape编码呢?测试时发现“%”只转一次的话,遇到“%40”之类的字符时还是会出问题。
所以我推测,字符在使用前会进行两次unescape解码,于是对应的做两次escape编码果然没问题了。
虽然预载对象是直接设置滤镜的src属性,但也有“%”的拼接字问题,所以也要escape编码。
ps:虽然单引号和双引号这里并不是必要,还是一起替换掉安心点。
还要注意预览对象不要用filters.item的方式设置滤镜。
因为元素插入文档之前,并不能通过filters.item获取滤镜对象,但能通过style预先设置filter。
所以在不确定元素位置的情况下,只能用style来设置filter了。
最后调用_imgShow设置尺寸:
this._imgShow( ImagePreview.TRANSPARENT, preload.offsetWidth, preload.offsetHeight );
由于img是一个图片对象,默认会显示一个小图标,为了去掉这个小图标,可以让它显示一个透明图片。
程序传递了ImagePreview.TRANSPARENT来设置透明图片,具体数据在Data URI 和 MHTML再说明。
ps:当然也可以在filter模式用div做预览图片对象就没有小图标了,但这样兼容起来会麻烦很多。
【AlphaImageLoader滤镜】
filter模式使用的是AlphaImageLoader滤镜。
它的作用是在对象容器边界内,在对象的背景和内容之间显示一张图片。
如果载入的是png图片,其透明度会被支持,因此它更多地用来解决png的兼容问题。
详细参考msdn的AlphaImageLoader Filter和“Microsoft.AlphaImageLoader滤镜讲解”。
它包括三个属性:enabled(滤镜是否激活),sizingMethod(图像显示方式)和src(图像路径)。
程序主要使用后面两个属性。
sizingMethod有三种方式:
crop:剪切图片以适应对象尺寸;
image:默认值。增大或减小对象的尺寸边界以适应图片的尺寸;
scale:缩放图片以适应对象的尺寸边界。
预载图片对象_preload,需要获取图片的原始尺寸,所以要用image方式。
而预览图片对象img,则要按设定尺寸显示图片,所以要用scale方式。
而src属性设置的路径还支持本地路径,是实现filter模式的关键所在。
还好滤镜并没有像file控件那样提高安全性,否则ie7/8就没有办法实现本地预览了。
【nsIDOMFile接口】
ff从3.0(或许更早)开始,就不能通过file控件的value属性获取文件本地路径,也不支持直接用本地路径显示图片。
不过欣喜的是,它同时也提供了nsIDOMFile接口,能更好地获取文件数据。
在ff的file控件有一个FileList对象,包含了带nsIDOMFile接口的File对象。
ps:FileList对象貌似是一个NodeList集合,但目前只能用第一个,可能是为了将来实现一个file控件选择多个文件的功能预留的。
这个File对象有三个获取文件数据的方法:
getAsText:获取文件的文本数据,可以通过参数设置编码;
getAsDataURL:获取文件的Data URI(URL?)数据;
getAsBinary:获取文件的二进制数据。
其中getAsDataURL获得的Data URI数据可以用于显示图片,_domfileData中就是用它来获取数据的。
File对象还支持两个属性:fileName(文件名,不包括路径)和fileSize(文件大小)。
相关具体说明参考mozilla的File和nsIDOMFile。
【Data URI 和 MHTML】
上面已经多次提到Data URI,详细介绍请看秦歌的“Data URI 和 MHTML”。
Data URI的主要作用是以字符代替数据,从而把文件“嵌”在代码里。
除了ie,其他浏览器基本都很好的支持了Data URI。
ie8也有限度地支持,详细参考msdn的data Protocol。
由于opera,safari和chrome需要remote模式的浏览器都支持Data URI,所以程序返回的是Data URI形式的数据。
相比返回路径的方法,返回Data URI不需要创建文件,还少一次HTTP请求。
ps:ie8只支持32k的Data URI数据,在ie8使用时要注意数据大小。
在filter模式需要一个透明图片来去掉img默认显示的小图标,一般的方法需要一个图片文件。
为了“省下”这个文件,可以使用Data URI来做一个1*1的透明图片:
data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==
支持Data URI的情况下,只要把img的src设置为这个值就可以显示一个透明图片了。
虽然ie6/7不支持Data URI,但还有mhtml可以使。
在ImagePreviewd.js开头有一段注释了的代码:
代码
Content-Type: multipart/related; boundary="_CLOUDGAMER"
--_CLOUDGAMER
Content-Location:blankImage
Content-Transfer-Encoding:base64
R0lGODlhAQABAJEAAAAAAP///////wAAACH5BAEAAAIALAAAAAABAAEAAAICVAEAOw==
其中boundary的值是分隔符标识,说明用于分隔数据段的字符。
Content-Location说明关联引用位置,可以用作数据段的标识。
Content-Transfer-Encoding就是字符编码形式。
后面的代码就是1*1的透明图片的base64编码数据。
然后在代码中这样调用(例如设置img元素的src属性):
mhtml:文件完整路径!blankImage
就可以链接到一个透明图片了。
接着就要解决如何获得script(js文件)的完整路径(包含http开头的路径)的问题了。
首先要在脚本运行时获取,当前运行的script肯定是document.scripts的最后一个:
document.scripts[document.scripts.length - 1]
ps:ff不支持document.scripts,可以用getElementsByTagName("script")来兼容。
接着可以利用getAttribute从src获取script的完整路径:
document.scripts[document.scripts.length - 1].getAttribute("src", 4)
ie6/7的getAttribute支持第二个参数,设为4表示返回完整路径的url地址,详细参考msdn的getAttribute Method。
结合Data URI 和 MHTML可以这样得到透明图片数据:
ImagePreview.TRANSPARENT = $$B.ie7 || $$B.ie6 ?
"mhtml:" + document.scripts[document.scripts.length - 1].getAttribute("src", 4) + "!blankImage" :
"data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==";
使用时要注意:
脚本必须单独另存为一个文件,作为mhtml需要的文件路径。
要自动获取完整路径需要用script标签链接文件。
【超空间】
程序还有一个dispose方法用于销毁程序。
包括这几个部分:
_upload上传文件对象:它本身已经有一个dispose方法来销毁程序;
_preload预载图片对象:先清除它的onload/onerror事件再移除元素;
file和img属性:直接设为null,由于不是程序创建的元素,留给使用者来移除。
说到移除元素,顺便说一下超空间(DOM hyperspace),这是从“ppk谈javascript”中看到的。
大概指的是当元素不在dom里面,而js又有关联时,元素并不会消失,而是保存在一个称为“超空间”的地方。
详细参考书的DOM 超空间部分。
书中还说可以根据是否有parentNode来判断元素是否在超空间,但测试以下代码:
<body></body>
<script>
var elm = document.createElement("div");
alert(elm.parentNode);
document.body.removeChild(document.body.appendChild(elm));
alert(elm.parentNode);
</script>
第一次parentNode都是null,没有问题,按理第二次也应该是null,但ie却是一个object。
经测试,这个object的nodeType是11,也就是一个碎片对象(FRAGMENT)。
而且各个被removeChild移除的元素的parentNode都不相同,即会生成不同的碎片对象。
这种情况算不算在“超空间”呢,不过书中也只是说“一般来说”,也不用太考究。
那么用innerHTML清除呢?再测试以下代码:
<body><div id="test"></div></body>
<script>
var elm = document.getElementById("test");
document.body.innerHTML = "";
alert(elm.parentNode);
</script>
结果在ie也是null了,看来removeChild和innerHTML在清除元素时产生了不同的结果。
那个碎片对象貌似没什么用(难道为了保证有parentNode?),那是不是innerHTML就一定比removeChild好呢?
再测试以下代码:
代码
<body>
<style>div{border:1px solid #000; height:20px;}</style>
<span><div id="test1">test1</div></span>
<span><div id="test2">test2</div></span>
</body>
<script>
var div1 = document.getElementById("test1"), parent1 = div1.parentNode;
parent1.removeChild(div1);
alert(div1.tagName + ":" + div1.innerHTML);
parent1.appendChild(div1);
var div2 = document.getElementById("test2"), parent2 = div2.parentNode;
parent2.innerHTML = "";
alert(div2.tagName + ":" + div2.innerHTML);
parent2.appendChild(div2);
</script>
当使用removeChild时,移除元素的结构并没有发生变化,各个浏览器的效果都一样。
而使用innerHTML清除时,其他浏览器的效果跟removeChild一样,但在ie被移除的元素就只剩下一个“外壳”了。
个人推测,ie在使用innerHTML时,被移除的元素会变成一个个单独的元素,失去了彼此的联系。
形象点说就是removeChild是直接掰断树枝,还能继续嫁接使用,而innerHTML是把需要的树叶节点取下来,再把树枝烧掉。
ps:仅仅是推测,谁有官方资料请告诉我。
那么removeChild的好处是移除的元素能再次使用,兼容性好,不好的地方是ie会产生一个没用的碎片对象。
而innerHTML的好处是不会产生多余的碎片对象,方便高效,但在ie被移除的元素基本不能再用,有兼容性问题。
那就可以根据需要使用不同的方法了,至于防止内存泄漏用那个好,感觉是innerHTML,但没有更深入研究的话还说不清楚。
使用技巧
一般来preview方法都是在onchange中调用,即选择文件后立即显示预览。
在不需要程序时最好执行一次dispose方法来销毁程序,防止内存泄漏等。
利用ImagePreview.TRANSPARENT可以显示透明图片,而不需另外隐藏或增加文件。
第二个实例中的ResetFile是用来重置file控件的,详细参考这里file的reset。
而file控件样式设置详细参考这里的file样式。
asp版本使用Persits.Jpeg组件缩放图片,测试请先安装该组件。
使用说明
实例化时,有两个必要参数,分别是file控件对象和img元素的预览显示对象:
new ImagePreview( file, img );
可选参数用来设置系统的默认属性,包括:
属性: 默认值//说明
mode: ImagePreview.MODE,//预览模式
ratio: 0,//自定义比例
maxWidth: 0,//缩略图宽度
maxHeight: 0,//缩略图高度
onCheck: function(){},//预览检测时执行
onShow: function(){},//预览图片时执行
onErr: function(){},//预览错误时执行
以下在remote模式时有效
action: undefined,//设置action
timeout: 0//设置超时(0为不设置)
如果要使用remote模式必须设置一个action。
还提供了以下方法:
preview:执行预览操作;
dispose:销毁程序。
2010-07-09
struts2 中文教程
— Web应用的发展
— Model 1和Model 2
— MVC思想
— MVC模式的优势
— 常用MVC框架及其特征
— Struts 1的基本结构及其存在的问题
— WebWork的基本结构
— Struts 2的起源
— Struts 2的框架架构
— Struts 2的标签库
— Struts 2的控制器组件
— Struts 1和Struts 2的对比
— Struts 2的下载和安装
— 纯手工创建一个Web应用
— 纯手工创建一个Struts 2应用
— 实现Struts 2的Action
— 配置Struts 2的Action
— 在Action中访问HttpSession
— 在JSP中输出Action的返回值
— 使用Struts 2的表单标签
— 程序国际化初步
— 数据校验初步
— Struts 1框架的基本知识
— 使用Struts 1框架开发Web应用
— WebWork框架的基本知识
— 使用WebWork框架开发Web应用
— 在Eclipse中整合Tomcat
— 使用Eclipse开发Web应用
— 为Web应用增加Struts 2支持
— Struts 2框架的MVC组件
— Struts 2框架的流程
— 通过web.xml文件加载Struts 2框架
— 通过struts.properties文件配置Struts 2属性
— struts.xml文件的结构
2010-06-08
MyEclipseKeyGen_for_4.1
MyEclipseKeyGen_for_4.1
MyEclipseKeyGen_for_4.1
MyEclipseKeyGen_for_4.1
MyEclipseKeyGen_for_4.1
2009-10-28
php中文完全开发手册
序文
I. 入门指引
1. 简介
2. 简明教程
3. 安装
4. 运行时配置
II. 语言参考
5. 基本语法
6. 类型
7. 变量
8. 常量
9. 表达式
10. 运算符
11. 流程控制
12. 函数
13. 类与对象
14. 引用的解释
III. 安全
15. 安全
IV. 特点
16. 用 PHP 进行 HTTP 认证
17. Cookies
18. 文件上传处理
19. 使用远程文件
20. 连接处理
21. 数据库永久连接
22. 安全模式
23. PHP 的命令行模式
V. 函数参考
I. Apache 函数库
II. 数组函数库
III. Aspell functions [deprecated]
IV. BCMath Arbitrary Precision Mathematics Functions
V. Bzip2 Compression Functions
VI. Calendar Functions
VII. CCVS API Functions [deprecated]
VIII. Windows 的 COM 支持函数库
IX. 类/对象函数库
X. ClibPDF Functions
XI. Crack Functions
XII. CURL, Client URL Library Functions
XIII. Cybercash Payment Functions
XIV. Cyrus IMAP administration Functions
XV. Character Type Functions
XVI. Database (dbm-style) Abstraction Layer Functions
XVII. 时间日期函数库
XVIII. dBase Functions
XIX. DBM Functions [deprecated]
XX. dbx Functions
XXI. DB++ Functions
XXII. Direct IO Functions
XXIII. 目录函数库
XXIV. DOM XML Functions
XXV. .NET Functions
XXVI. Error Handling and Logging Functions
XXVII. File Alteration Monitor Functions
XXVIII. FrontBase Functions
XXIX. filePro Functions
XXX. 文件系统函数库
XXXI. Forms Data Format Functions
XXXII. FriBiDi Functions
XXXIII. FTP 函数库
XXXIV. Function Handling Functions
XXXV. Gettext
XXXVI. GMP Functions
XXXVII. HTTP 相关函数库
XXXVIII. Hyperwave Functions
XXXIX. Hyperwave API Functions
XL. iconv Functions
XLI. 图像函数库
XLII. IMAP, POP3 and NNTP Functions
XLIII. Informix Functions
XLIV. InterBase Functions
XLV. Ingres II Functions
XLVI. IRC Gateway Functions
XLVII. PHP / Java Integration
XLVIII. LDAP Functions
XLIX. LZF Functions
L. Mail Functions
LI. mailparse Functions
LII. 数学函数库
LIII. Multi-Byte String Functions
LIV. MCAL Functions
LV. Mcrypt Encryption Functions
LVI. MCVE Payment Functions
LVII. Mhash Functions
LVIII. Mimetype Functions
LIX. Microsoft SQL Server Functions
LX. Ming functions for Flash
LXI. Miscellaneous Functions
LXII. mnoGoSearch Functions
LXIII. mSQL Functions
LXIV. MySQL 函数库
LXV. Improved MySQL Extension
LXVI. Mohawk Software Session Handler Functions
LXVII. muscat Functions
LXVIII. Network Functions
LXIX. Ncurses Terminal Screen Control Functions
LXX. Lotus Notes Functions
LXXI. NSAPI-specific Functions
LXXII. Unified ODBC Functions
LXXIII. Object Aggregation/Composition Functions
LXXIV. Oracle 8 函数库
LXXV. OpenSSL Functions
LXXVI. Oracle 函数库
LXXVII. Ovrimos SQL Functions
LXXVIII. 输出控制函数
LXXIX. Object property and method call overloading
LXXX. PDF functions
LXXXI. Verisign Payflow Pro Functions
LXXXII. PHP Options&Information
LXXXIII. POSIX Functions
LXXXIV. PostgreSQL 数据库函数库
LXXXV. Process Control Functions
LXXXVI. Program Execution Functions
LXXXVII. Printer Functions
LXXXVIII. Pspell Functions
LXXXIX. GNU Readline
XC. GNU Recode Functions
XCI. 正则表达式函数库(Perl 兼容)
XCII. qtdom Functions
XCIII. 正则表达式函数库(POSIX 扩展)
XCIV. Semaphore, Shared Memory and IPC Functions
XCV. SESAM Database Functions
XCVI. Session Handling Functions
XCVII. Shared Memory Functions
XCVIII. SimpleXML functions
XCIX. SOAP Functions
C. SQLite
CI. Shockwave Flash Functions
CII. SNMP 函数库
CIII. Socket Functions
CIV. Standard PHP Library (SPL) Functions
CV. Stream Functions
CVI. 字符串处理函数库
CVII. Sybase Functions
CVIII. TCP Wrappers Functions
CIX. Tidy Functions
CX. Tokenizer Functions
CXI. URL 函数库
CXII. 变量函数库
CXIII. vpopmail Functions
CXIV. W32api 函数库
CXV. WDDX Functions
CXVI. XML 语法解析函数库
CXVII. XML-RPC 函数库
CXVIII. xdiff Functions
CXIX. XSLT Functions
CXX. YAZ Functions
CXXI. YP/NIS Functions
CXXII. Zip File Functions (Read Only Access)
CXXIII. Zlib Compression Functions
VI. Zend API
24. Overview
25. Extension Possibilities
26. Source Layout
27. PHP's Automatic Build System
28. Creating Extensions
29. Using Extensions
30. Troubleshooting
31. Source Discussion
32. Accepting Arguments
33. Creating Variables
34. Duplicating Variable Contents: The Copy Constructor
35. Returning Values
36. Printing Information
37. Startup and Shutdown Functions
38. Calling User Functions
39. Initialization File Support
40. Where to Go from Here
41. Reference: Some Configuration Macros
42. API Macros
VII. PHP API: 扩展开发接口
43. Streams API for PHP Extension Authors
VIII. FAQ: 常见问题
44. 一般信息
45. 邮件列表
46. 获取 PHP
47. 数据库问题
48. 安装
49. 编译问题
50. 使用 PHP
51. PHP 和 HTML
52. PHP 和 COM
53. PHP 和其它语言
54. 从 PHP/FI 2 移植到 PHP 3
55. 从 PHP 3 移植到 PHP 4
56. 杂类问题
IX. 附录
A. PHP 及其相关工程的历史
B. Migrating from PHP 4 to PHP 5
C. 从 PHP 3 移植到 PHP 4
D. 从 PHP/FI 2 移植到 PHP 3
E. PHP 的调试
F. 扩展 PHP 3
G. 函数别名列表
H. 保留字列表
I. 资源类型列表
J. 支持的协议/封装协议列表
K. 所支持的套接字传输器(Socket Transports)列表
L. PHP 类型及比较符表
M. 解析器代号列表
N. 关于本手册
O. Open Publication License
P. 函数索引
Q. 补充说明
X. 微软 HTML 帮助版本
57. 关于此版本
58. Using PHP Manual CHM Edition
59. The Full Text Search
60. Specialities of this Edition
61. Integrating the PHP Manual
62. Skin development
63. CHM Edition Credits
2009-10-27
ue_chinese
UltraEdit 是能够满足你一切编辑需要的编辑器。UltraEdit 是一套功能强大的文本编辑器,可以编辑文本、十六进制、ASCII 码,完全可以取代记事本(如果你的电脑足够强大),内建英文单字检查、C++ 及 VB 指令突显,可同时编辑多个文件,而且即使开启很大的文件速度也不会慢。软件附有 HTML 标签颜色显示、搜寻替换以及无限制的还原功能,一般大家喜欢用其来修改EXE 或 DLL 文件。
特点是:
1、打开文件速度快
2、列操作功能强大
3、有代码折叠功能
4、可以进行16进制编辑
2009-10-27
Alcohol-v1.95
光盘刻录软件的完整解决方案,能完整的仿真原始光盘片,让你能不必将光盘映像文件刻录出来便可以使用虚拟光驱执行虚拟光盘且其效能比实际光驱更加强大;另外,Alcohol 120% 可支持多种映像档案格式,你可以利用其它软件所产生的光盘映像文件直接挂载进 Alcohol 120%之虚拟光驱中,便可直接读取其内容;你也可以直接将 CD,DVD 或光盘映像文件刻录至空白 CD-R / CD-RW / DVD-R / DVD-RW / DVD-RAM / DVD+RW 之中,而不必透过其它的刻录软件,方便你对光盘及映像文件的管理。产品特色:可虚拟 31 部虚拟光驱;让计算机游戏玩家拥有 200 倍超高速光驱,不用烦恼光驱速度太慢;可直接进行对刻或将映像文件刻录至空白光盘片;同时支持多部刻录器并同时进行读取及刻录动作;可用 RAW 模式执行 1:1 的读取和刻录并忠实的将光盘备份或以光盘映像文件储存;支持读取及刻录各式光盘映像文件 (mds, ccd, cue, bwt, iso 和 cdi);使用简单,使用鼠标点选三次即可执行对刻;支持 AudioCD、VideoCD、PhotoCD、Mixed Mode CD、CD Extra、Data CD、CD+G、DVD (Data)、DVD-Video 的读取及刻录。
全功能型虚拟光驱, 能完整的仿真原始光盘片, 可支持多种映像档案格式, 还支持最新的SD 2.8加密光盘的直接复制了, 并且现在可以正确模拟SecuROM V4.x的保护方式; 另外支持 CD, DVD 或光盘映像文件刻录至空白 CD-R / CD-RW / DVD-R / DVD-RW / DVD-RAM / DVD+RW 之中, 而不必通过其它的刻录软件, 方便对光盘及映像文件的管理.
2009-06-17
urlrewrite.xml 正则问题
2010-06-27
java高级算法问题求解 牛人请进
2010-02-24
TA创建的收藏夹 TA关注的收藏夹
TA关注的人