我正在使用Uploadify jQuery插件将图片上传到我的网站。我自己用自己的队列标记自定义它。这是标记:

<form id="upload-form" action="" method="post" enctype="multipart/form-data">
    <div id="file-queue">
        <ul>

        </ul>
    </div>

    <div id="upload-form-buttons">
        <input type="file" name="images" id="image-upload" />
        <a href="" class="primary-button">Upload</a>
    </div>
</form>


还有Uploadify代码:

$('#image-upload').uploadify({
    'swf': '/swf/uploadify.swf',
    'uploader': 'uploadify.php',
    'buttonClass': 'primary-button',
    'buttonText': 'Select files',
    'height': 28,
    'width': 100,
    'queueID': 'file-queue',
    'overrideEvents': ['onSelect'],
    'onSelect': function(file) {
        onSelect(file);
    },
    'onCancel': function(file) {
        onCancel(file);
    }
});


当用户选择文件时,我将触发此功能以将其添加到上传队列中:

function onSelect(file) {
    // Add the file to the queue
    $('#file-queue ul').append('<li class="' + file.id + '">' + trimName(file.name) + '<a href="javascript:$(\'#image-upload\').uploadify(\'cancel\')"><img class="cancel" src="/img/cancel.png" /></a><span class="filesize">' + readableFileSize(file.size) + '</span></li>');
}


该文件的标记显示为:

<li class="SWFUpload_0_0">
    IMG_20120610_185131.jpg
    <a href="javascript:$('#image-upload').uploadify('cancel')">
        <img class="cancel" src="/img/cancel.png">
    </a>
    <span class="filesize">606.1KB</span>
</li>


现在,当我单击“取消”按钮时,Uploadify不会触发取消事件。这是应该触发的功能:

function onCancel(file) {
    // Remove file from queue
    $('#file-queue ul li.' + file.id).remove();
}


但是文件永远不会从队列中删除。如果将$('#image-upload').uploadify('cancel')放在我的onSelect函数中(我以此作为测试),则可以正常工作。我也尝试做类似$('img.cancel').live('click', function() { //... });的操作,但是它也没有被解雇。

同样有趣的是,如果我在页面上将$('#image-upload').uploadify('cancel');粘贴到Chrome javascript控制台中时,它又返回为undefined

最佳答案

我有同样的问题,对我来说,解决方案是将处理程序放入Uploadify回调onInit

$('#image-upload').uploadify({
    ...
    'onInit': function () {
         $('img.cancel').live('click', function() { //... });
    }
});


它对我有用,但我实际上不明白,如果在Uploadify外部设置了处理程序,为什么取消不会触发

关于javascript - Uploadify取消方法未触发,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/11367931/

10-10 01:19
查看更多