0

您好，我想弄清楚如何修复这个上传进度条，以便它在 Firefox 中工作。

在 Firefox 中，它仅达到 90% 左右，在 chrome 中显示进度为 100%

任何想法都非常感谢

*干杯

编辑我应该提到这是使用 jQuery 表单插件http://jquery.malsup.com/form/

编辑不确定我做了什么，但它现在将状态设置为 99% 任何想法如何在 Firefox 中将其设置为 100% :-)

我已经更新了下面的代码

下面的代码

<style>
<!--
/*form {display: block; background: #333; padding: 15px}*/

.progress {margin-left:auto; margin-right: auto; position:relative; width:400px; border: 1px solid #ddd; padding: 1px; border-radius: 3px;}
.bar {margin-left:auto; margin-right: auto;background-color: #B4F5B4; width:0%; height:20px; border-radius: 3px; }
.percent {position:absolute; display:inline-block; top:3px; left:48%;}
-->
</style>

和 jQuery

        <div class="progress">
        <div class="bar"></div >
        <div class="percent">0%</div >
    </div>
    <div id="status"></div>


<script type='text/javascript'>
<!--  

jQuery('document').ready(function() {
    var bar = $('.bar');
    var percent = $('.percent');
    var status = $('#status');   
        $('form').ajaxForm({
            dataType: 'script',
            url: "{{=URL('default', 'user_song_form')}}",
            beforeSend: function() {
                status.empty();
                var percentVal = '0%';
                bar.width(percentVal)
                percent.html(percentVal);
            },             
            uploadProgress: function(event, position, total, percentComplete) {
                var percentVal = percentComplete + '%';
                bar.width(percentVal)
                percent.html(percentVal);
            },
            complete: function(xhr) {
                status.html('Thank You Upload Complete!');
            }     
        });         
   });     
-->

</script>
4

3 回答 3

2

最简单的方法是使用我推荐的上传器

http://fineuploader.com/

最酷的是不需要外部依赖

在此处输入图像描述

于 2013-01-07T05:39:16.463 回答
1

我通过更改完整功能解决了上传状态的问题

jQuery 代码现在如下所示

<script type='text/javascript'>
<!--  

jQuery('document').ready(function() {
    var bar = $('.bar');
    var percent = $('.percent');
    var status = $('#status');   
        $('form').ajaxForm({
            dataType: 'script',
            url: "{{=URL('default', 'user_song_form')}}",
            beforeSend: function() {
                status.empty();
                var percentVal = '0%';
                bar.width(percentVal)
                percent.html(percentVal);
            },             
            uploadProgress: function(event, position, total, percentComplete) {
                var percentVal = percentComplete + '%';
                bar.width(percentVal)
                percent.html(percentVal);
            },
            complete: function(xhr) {
                var percentVal = '100%';
                bar.width(percentVal)
                percent.html(percentVal);
                status.html('Thank You Upload Complete!');
            }     
        });         
   });     
-->

</script>
于 2012-07-07T20:51:24.660 回答
0

考虑使用 uploadify 作为替代方案。它工作得很好，可以在 IE 和 Firefox 100% 中工作

http://www.uploadify.com/

于 2012-07-07T16:06:27.677 回答