我们可以将Uploadify简单地用于文件上传输入的渐进增强吗?

时间:2010-10-26 01:55:52

标签: jquery file-upload uploadify

当我输入文件时,我通常将他们的opacity设置为0并在他们下面放置一个browse按钮(仅仅因为文件输入本身很丑陋且不灵活 - 我必须符合设计师的要求。)

我偶然发现了Uploadify

我的表单目前正在作为带有文件输入上传的标准表单。

我希望只为功能使用Uploadify ...

  • 强制将上传提示转到分机(jpgjpegpnggif)。
  • 显示文件名一旦选中并进行文件大小

我将选项设置为在选择时不自动上传。

当我现在使用此jQuery调用代码提交表单时......

var fileTypes = [];
$.each(config.validExt, function(i, ext) {
 fileTypes.push('*.' + ext);
});

var fileInputs = form.find('input[type=file]');

fileInputs.uploadify({
'uploader'  : config.basePath + 'assets/packages/uploadify/uploadify.swf',
'script'    : config.basePath + 'assets/packages/uploadify/uploadify.php',
'cancelImg' : config.basePath + 'assets/packages/uploadify/cancel.png',
'auto'      : false,
'folder'    : config.basePath + 'application/uploads',
'fileDesc'  : 'Images (' + config.validExt.join(', ') + ')' ,
'fileExt'   : fileTypes.join(';')
});

form.find('button[type=submit]').click(function(event) {

fileInputs.uploadifyUpload();

});  

它只会摔倒并且不会上传任何内容。

另外,从客户端发送folder听起来有点不稳定,但我打算通过PHP选择该文件夹。

所以基本上,我希望表单像往常一样,只是为了从使用Uploadify获得这些好处。

这可能吗?

由于

1 个答案:

答案 0 :(得分:0)

尝试通过onAllComplete选项提交表单。确保该按钮不是提交按钮。

fileInputs.uploadify({
  'uploader'      : config.basePath + 'assets/packages/uploadify/uploadify.swf',
  'script'        : config.basePath + 'assets/packages/uploadify/uploadify.php',
  'cancelImg'     : config.basePath + 'assets/packages/uploadify/cancel.png',
  'auto'          : false,
  'folder'        : config.basePath + 'application/uploads',
  'fileDesc'      : 'Images (' + config.validExt.join(', ') + ')' ,
  'fileExt'       : fileTypes.join(';'),
  'onAllComplete' : function(event,data) {
      form.submit();
    }
});

form.find('#submit').click(function(event) {
  fileInputs.uploadifyUpload();
});