如何使用cloudinary的jQuery显示成功消息

Question

我正在使用cloudinary Upload小部件上传多个图像。 我已成功将图片上传到cloudinary，但在处理完成后无法显示成功消息。我已使用以下javascript上传多张图片。

 <script src="//widget.cloudinary.com/global/all.js" type="text/javascript"></script>

<script src='//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'></script>

<script type="text/javascript">
    document.getElementById("upload_widget_opener").addEventListener("click", function() {
        cloudinary.openUploadWidget({ cloud_name: 'shreeya', upload_preset: 'album_widget', tags: '{{ uploadTag }}'  },
            function(error, result) { console.log(error, result) });
    }, false);
</script>

在文档中，提供了如何在上传过程完成后显示成功消息的信息。下面给出了文档中如何显示成功的代码

$(document).on('cloudinarywidgetsuccess', function(e, data)

 {
  console.log("Global success", e, data);
});

现在，我需要帮助，如何在图像上传过程完成后如何使用此jquery代码显示消息。

Answer 1

仅根据您所关注的cloudinary文档 ，您可以使用以下内容：

<!-- Just make the placeholder for message (anywhere on the necessary place in the document)-->
<!-- like -->
<span id="fileResponce"></span>

然后，您可以使用cloudinary提供的相同事件：

$(document).on('cloudinarywidgetsuccess', function(e, data) {
    $('#fileResponce').text('Files uploaded successfully..!'); //and append the message in the placeholder span
});

Answer 2

您已经为文件上传时间设置了事件监听器。 这是这一行：

function(error, result) { console.log(error, result) }

您只需要扩展它以检查result是什么

document.getElementById("upload_widget_opener").addEventListener("click", function() {
    cloudinary.openUploadWidget({ 
        cloud_name: 'shreeya', 
        upload_preset: 'album_widget', 
        tags: '{{ uploadTag }}'  
    },
    function(error, result) {       
        if (result && result.event === 'success') {
            console.log("Global success", result);
        }

        if (error) {
            console.log("Error", error);
        }
    }
    );
}, false);

请参阅： https ： //cloudinary.com/documentation/upload_widget#cloudinary_createuploadwidget_options_resultcallback

cloudinary.createUploadWidget(options, resultCallback)

resultCallback是用于事件处理的可选函数。 回调方法具有以下签名function(error, result) ，其中error如果成功则为null ，或者如果失败则为错误消息，而result是详述触发事件的JSON对象。