Question

我正在使用在Jquery UI对话框中的uploadify flash组件，用于使用AJAX将文件上传到Web服务器。但是，在多个文件上传的情况下，用户必须等到所有文件都已上传。

在此之前，无法关闭该对话框 - 如果用户关闭对话框，则上传者将丢失。

那么，如何使用uploadify或任何其他插件在后台上传文件？

Answer 1

首先，当用户点击提交按钮上传文件时，您需要禁用关闭对话框按钮。

然后在初始化uploadify时，您可以使用某些方法。 Uploadifu有一个“queueComplete”方法，可以让您知道何时处理完所有文件。以下是该网站提供的样本。

$(function() {
    $("#file_upload").uploadify({
        'swf'      : '/uploadify/uploadify.swf',
        'uploader' : '/uploadify/uploadify.php',
        'onQueueComplete' : function(queueData) {
            alert(queueData.uploadsSuccessful + ' files were successfully uploaded.');
        }
    });
});

上传所有文件后，onQueueComplete将触发您放置的代码。因此，您可以启用关闭对话框按钮。

至于启用/禁用对话框按钮，您需要向我们提供按钮的代码。这是一个简单的链接吗？

Answer 2

如何更改上传对话框的css，以便在上传开始时它变成窗口底部的栏？完全删除对话框不是一个好主意，用户不知道上传何时完成以及何时他/她可以安全地离开页面。

如果你真的想删除对话而不删除上传，那么总是

$(".upload_dialog").css({ 'display':'none' });

编辑：我尝试了uploadify网站，似乎包含上传对话框的div有一个“uploadify-queue”类，里面的项目是“uploadify-queue-item”。您可以通过右键单击您感兴趣的元素并选择“Inspect element”（如果您使用的是Chrome或Firefox）来计算出类似的内容。如果您正在使用Chrome或Firefox以外的任何其他产品进行开发，请立即切换！

因此，将此添加到CSS应该会在屏幕底部显示一个栏。

.uploadify-queue 
{
  margin: 0;
  position: fixed;
  bottom: 0;
  width: 100%;
  z-index: 1000;
  background: whiteSmoke;
}

Answer 3

您可以使用以下步骤实现后台上传：

1）在lightbox / ui对话框中创建uploadify。

2）在uploadify下方给出一个按钮，如完成/开始上传，当用户点击此按钮隐藏poup框，隐藏覆盖并调用uploadify方法开始上传文件。

注意：尝试使用z-index隐藏其他元素下面的poup /对话框。

使用uploadify上传后台

3 个答案: