0

您将如何添加功能以显示通过 jQuery 和 PHP 上传的文件的进度？

我目前有以下代码。理想情况下，我想显示一个图像进度条，使用 CSS 增加大小，然后上传完成。

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function () {

    $("#formsubmit").click(function () {

var iframe = $('<iframe name="postiframe" scr="http://www.google.co.uk" id="postiframe" style="display: none" />');

$("body").append(iframe);

var form = $('#theuploadform');
form.attr("action", "ddd.php");
form.attr("method", "post");
form.attr("enctype", "multipart/form-data");
form.attr("encoding", "multipart/form-data");
form.attr("target", "postiframe");
form.attr("file", $('#userfile').val());
form.submit();

$("#postiframe").load(function () {
    iframeContents = $("#postiframe")[0].contentWindow.document.body.innerHTML;
    $("#textarea").html(iframeContents);
});

return false;

});

});
</script>

<form id="theuploadform" method="post" enctype="multipart/form-data">
<input type="hidden" name="<?php echo ini_get("session.upload_progress.name"); ?>" value="123" />
<input id="userfile" name="userfile[]" size="50" type="file" multiple />
<input id="formsubmit" type="submit" value="Send File" />
</form>

<div id="textarea"></div>

干杯；）

4

1 回答 1

0

You can only add a progress bar if you do it with ajax but the ajax file upload is not supported in IE and old FF versions.

So you'll need to use iframes without progress bar if it isn't supported. That's why many people had made nice workarounds for that. Some names of uploader plugins for jQuery are listed here.

You can also do it by yourself without a plugin but you can't use the jQuery ajax function because since jQuery 1.5.1 it doesn't give you the ability to access the native XHR object.

于 2012-04-21T15:23:58.633 回答