0

在我们的 Rails 应用程序中,我们一直在使用uploadify来上传图片,并使用prettyPhoto在灯箱上显示图片。如果单独使用,两者都可以很好地工作。现在我们想像dropbox一样在灯箱上显示 uploadify 控件,但是如果与 prettyPhoto 一起使用,它就会开始尖叫。

这是使用uploadify 和prettyPhoto 的示例html。

<!DOCTYPE html>
<html>
<head>
    <title>My Uploadify Implementation</title>
    <link rel="stylesheet" type="text/css" href="uploadify.css">
    <link rel="stylesheet" type="text/css" href="prettyPhoto.css" />
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="jquery.uploadify-3.1.min.js"></script>
    <script src="jquery.prettyPhoto.js" type="text/javascript"></script>

    <script type="text/javascript">
    $(function() {
        $('#file_upload').uploadify({
            'swf'      : 'uploadify.swf',
            'uploader' : 'uploadify.php'
            // Your options here
        });

        $('#closeme').live('click', function() {
            $.prettyPhoto.close();
            return false;
        });

        $("a[rel^='prettyPhoto']").prettyPhoto();

    });
    </script>
</head>
<body>
<a href="#inline-1" rel="prettyPhoto" >popop</a>
    <div id="inline-1" style="display:none;">
        <p>This is inline content opened in prettyPhoto.</p>
        <input type="file" name="file_upload" id="file_upload" />
    </div>
</body>
</html>

在这里,您将看到弹出窗口的链接,通过单击该链接,它会在灯箱上显示 uploadify 控件。然后你从磁盘中选择图像上传到服务器。选择图像后,我面临两个问题:

1)Error: uncaught exception: Call to StartUpload failed在 FF 和 Crome 上出现 javascript 错误

2) 所选图像未在灯箱上的 uploadify 控件中列出。如果您关闭小狗并再次单击弹出链接,它会显示文件列表。

如果我删除$("a[rel^='prettyPhoto']").prettyPhoto();行,Uploadify 工作正常。

您知道如何解决吗?

如果有人建议其他插件来实现这种 Dropbox 风格的上传器,我也将不胜感激。

谢谢,阿米特帕特尔

4

1 回答 1

0

您需要在打开灯箱后而不是在页面加载时初始化 uploadify。这是因为如果元素被隐藏,Flash 将不会加载。

我查看了 prettyPhoto api,找不到在灯箱完成打开后调用的任何事件,但这就是您需要做的。

于 2012-05-25T16:51:27.300 回答