jquery.fileEveryWhere.js一个跨浏览器的文件显示插件

先来看看输入类型="文件"在铬合金，即火狐浏览器这三个浏览器下表情各异吧

铬像是按钮标签组合，看起差异最大一张纸和即，是文本按钮的组合，就外形来看，火狐更标准，事实上火狐浏览器存在两个潜在问题：1、火狐对类型="文件"的投入的宽度定义目前是不支持的（但是消防支持大小属性，可以给大小设置一个值，来控制上传框的大小，至于这个大小到底是多大，见文章繁花火狐下输入类型="文件"的大小是多大)。2,火狐浏览器的提交文件表单时只提交文件名不提交路径，而工业管理学(工业工程)提交的是路径文件名铬合金也能提交路径文件名，但只显示文件名。火狐浏览器的提交文件表单时只提交文件名不提交路径（很遗憾，暂时没有解决方法)要让文件在各个浏览器显示统一，纯样式已经控制不了，只能用射流研究…脚本了。基本步骤有3:1,通过文本框和按钮去模拟一个输入类型="文件".2,把输入='文件'做成透明，用定位完全盖住文本框和按钮。3,当输入类型="文件"的待清扫房的时，用射流研究…将文本框的值设置成输入类型="文件"的值。了解步骤后，整个插件就很好写了，代码如下：复制代码代码如下： /* *文件无处不在-浏览器通用文件上传*版权所有-flowerszhong *[电子邮件保护]*/(函数($){ $。fn。随处文件=函数(选项){ var defaults={ wrappwidth : 300，WrapHeight: 30，ButtonWidth: 60，ButtonHeight: 28，ButtonText: '浏览，TextHeight: 28，textwidth : 240 }；定义变量选项=$。扩展（默认值、选项);var browser _ ver=$。浏览器。版本。substr(0，1)；var显示模式=($。浏览器。msie browser _ ver=' 7 ')？内联":"内联块；返回this.each(function() { //创建包含，设置为相对定位var包装器=$(' div class='文件包装器' ').css({ 'width':选项WrapWidth 'px '，height':选项WrapHeight 'px '、display': displayMode '、zoom': '1 '、position': 'relative '、overflow': 'hidden '、z-index ' : ' 1 ' })；//创建文本输入框，用于存放上传文件名称var text=$(' input class=' filename ' type=' text '/').css({ 'width':选项TextWidth 'px '，' heigth ' :选项TextHeight ' px ' })；//创建浏览按钮var button=$(' input class=' BTN文件' type=' button '/').val(选项. button text)；$(这个)。包装材料。父项()。追加（文本、按钮);$(这个)。css({ 'position': '绝对值'，' top': '0 '，' left': '0 '，' z-index': '2 '，' height':选项WrapHeight 'px '，width':选项WrapWidth ' px '、光标' : 'pointer '、不透明度' : '0.0 '、轮廓' : '0 '、滤镜' : ' alpha(不透明度33600)' })；if ($.browser.mozilla) { $(this).attr('size '，1(选项WrapWidth - 85)/6.5) } $(这个)。bind('change '，function() { text.val($(this)).val())；});});};})(jQuery)；使用很简单：$(“输入3360文件”).文件随处可见({ 0参数});这样就可以统一显示输入='文件，并且易于美化。下载该插件：jquery.fileEveryWhere.rar来自：http://www.cnblogs.com/flowerszhong/