仿163网盘无刷新文件上传系统

核心提示： 先说说iframe实现无刷新上传的原理：利用form的target属性，把数据提交到页面中一个（通常为隐藏的）iframe上，仿163网盘无刷新文件上传系统(2)，直观点说就是把“刷新”留给iframe，其实原理跟一般用iframe实现无刷新提交表单是一样的，例如我

先说说iframe实现无刷新上传的原理：利用form的target属性，把数据提交到页面中一个（通常为隐藏的）iframe上。直观点说就是把“刷新”留给iframe。

其实原理跟一般用iframe实现无刷新提交表单是一样的，只是这里换成是文件。

这里关键就是把form的target设为iframe的name：

this.Form.target = this._FrameName;

【iframe】

如果没有自定义iframe，程序在初始化时会自动创建无刷新所需的iframe的。

首先必须选择一个iframe名，这在无刷新时是必须的，为了每个实例能创建各自的iframe，这里用了一个随机数：

this._FrameName = "uploadFrame_" + Math.floor(Math.random() * 1000);

也可以用一个递增的计算器来代替随机数。

接着创建iframe，本以为用document.createElement("iframe")创建再设置它的name属性就行了。

却发现这样设置的name在ie居然不认（有说name是只读属性），还好在网上找到一个方法：“IE 创建元素，还有一个特点，就是可以连同属性一同创建”。

例如我想给动态创建的iframe设置name，可以这样：

document.createElement("<iframe name="" + this._FrameName + "">")

不过这个方式在ff会报错：

uncaught exception: String contains an invalid character (NS_ERROR_DOM_INVALID_CHARACTER_ERR)

估计是用createElement时不能带name，标准应该也是这样，所以兼容的方式这样写：

Code

var oFrame = isIE ? document.createElement("<iframe name="" + this._FrameName + "">") : document.createElement("iframe");
//为ff设置name
oFrame.name = this._FrameName;
oFrame.style.display = "none";