FineUploader 在 Html 刷新后中断
FineUploader breaks after Html refresh
我正在试用 FineUploader 的功能。我有 DIV,其中包含上传按钮和图像元素。
图片上传后,我在服务器端渲染一个新的DIV,然后用新的替换旧的DIV。新 DIV 在图像元素中包含新图像 url,因此用户会在页面上看到刷新的图像。
问题是,在我用新的 DIV 替换旧的 DIV 之后,FineUploader 就坏了。上传按钮不再打开 FineUploader 对话框。通过注释掉用新 DIV 替换旧 DIV 的代码,然后简单地手动刷新页面,我已经验证这确实是正在发生的事情。现在,通过打开文件上传对话框,上传按钮再次正常工作。因此,当 DIV 被替换时,FineUploader 似乎不喜欢将旧按钮替换为新按钮,即使 html 是相同的。
有没有办法"rebind" FineUploader 到一个新的按钮?我该怎么做?
谢谢。
Fine Uploader 在可见的上传按钮中嵌入了 "hidden" <input type="file">
(在您的情况下显然是 <div>
)。即使您将 container/button 替换为包含另一个隐藏 <input type="file">
的新文件,Fine Uploader 绑定到原始文件输入的所有数据和事件处理程序现在都消失了,因此 Fine Uploader 不知道何时选择了新文件,它无法在它也可能负责控制的页面上的其他文件输入中跟踪该按钮。
如果您想添加新按钮,您有两个选择:
- 在创建 Fine Uploader 实例时通过 the
extraButtons
option 声明这些按钮。您可以 show/hide 这些额外的按钮或根据需要在页面上移动它们。
- 创建您自己的文件输入按钮,附加一个更改事件侦听器,然后使用 the
addFiles
API method. 将在该事件处理程序中选择的任何文件添加到 Fine Uploader
在您的特定情况下,与其替换整个元素集,不如考虑简单地使用 JavaScript 将 <img>
元素的 src
属性更新为新的 [=41] =] 从您的服务器。您可以在 Fine Uploader onComplete
callback handler 中轻松获取此信息,前提是您的服务器 returns 上传响应中的新 URL。或者您可以随时向您的服务器发出 ajax 请求,并在响应中使用 URL 替换 <img>
.
上的 src
我正在试用 FineUploader 的功能。我有 DIV,其中包含上传按钮和图像元素。
图片上传后,我在服务器端渲染一个新的DIV,然后用新的替换旧的DIV。新 DIV 在图像元素中包含新图像 url,因此用户会在页面上看到刷新的图像。
问题是,在我用新的 DIV 替换旧的 DIV 之后,FineUploader 就坏了。上传按钮不再打开 FineUploader 对话框。通过注释掉用新 DIV 替换旧 DIV 的代码,然后简单地手动刷新页面,我已经验证这确实是正在发生的事情。现在,通过打开文件上传对话框,上传按钮再次正常工作。因此,当 DIV 被替换时,FineUploader 似乎不喜欢将旧按钮替换为新按钮,即使 html 是相同的。
有没有办法"rebind" FineUploader 到一个新的按钮?我该怎么做?
谢谢。
Fine Uploader 在可见的上传按钮中嵌入了 "hidden" <input type="file">
(在您的情况下显然是 <div>
)。即使您将 container/button 替换为包含另一个隐藏 <input type="file">
的新文件,Fine Uploader 绑定到原始文件输入的所有数据和事件处理程序现在都消失了,因此 Fine Uploader 不知道何时选择了新文件,它无法在它也可能负责控制的页面上的其他文件输入中跟踪该按钮。
如果您想添加新按钮,您有两个选择:
- 在创建 Fine Uploader 实例时通过 the
extraButtons
option 声明这些按钮。您可以 show/hide 这些额外的按钮或根据需要在页面上移动它们。 - 创建您自己的文件输入按钮,附加一个更改事件侦听器,然后使用 the
addFiles
API method. 将在该事件处理程序中选择的任何文件添加到 Fine Uploader
在您的特定情况下,与其替换整个元素集,不如考虑简单地使用 JavaScript 将 <img>
元素的 src
属性更新为新的 [=41] =] 从您的服务器。您可以在 Fine Uploader onComplete
callback handler 中轻松获取此信息,前提是您的服务器 returns 上传响应中的新 URL。或者您可以随时向您的服务器发出 ajax 请求,并在响应中使用 URL 替换 <img>
.
src