使用 AjaxUpload 创建的上传按钮行为奇怪答案

【问题标题】：Upload Button created with AjaxUpload behaves strange使用 AjaxUpload 创建的上传按钮行为奇怪
【发布时间】：2012-09-17 07:41:29
【问题描述】：

question 与其他有关此问题的问题有点不同。我遇到了与jQuery AjaxUpload, have to click button twice? 类似的问题，但我设法用我的解决方法解决了它。按钮来得很完美。但现在的问题是，当我从按钮的顶部或左侧拖动鼠标后单击该按钮时，它不起作用，但如果我从另一侧拖动鼠标，它工作正常。简而言之，当从顶部到达该按钮时，按钮会悬停，而不是 ajax 上传创建的隐藏文件选择器。

在第一张图片中，我从按钮的一侧取出鼠标指针，然后我可以选择文件。但如其他图像所示，我从按钮顶部取出鼠标指针，按钮悬停。

这是我的按钮代码：

<input type="button" value="Upload Image" class="imgUploadBtn" />

我的 JS sn-p:

function uploadAndGetImgUrl(tsource,status) {
    new AjaxUpload(tsource,{
        action: 'imageUpload.php',
        name: 'uploadfile',
        data: {},
        onSubmit: function(file, ext){
                if (! (ext && /^(jpg|png|jpeg|gif)$/.test(ext))){
                    // extension is not allowed
                    status.text('Only Images are Allowed');
                    return false;
                }
                status.text('Uploading...');
        },
        onComplete: function(file, response){
            //On completion clear the status
            status.text('');
            $('#idSpclImgLink').val(response);
            $('#idImgLink').val(response);
        }
    });
}

$(document).live("imgAttach",function() {
    alert("Want something Added");
    uploadAndGetImgUrl($('.imgUploadBtn'),$('#idStatus'));
});

我检查了 ajaxupload.3.5.js，但发现它在悬停时执行了一些过程，并使用左偏移和上偏移来保持悬停效果。但我还不能解决这个问题。知道为什么会这样吗？

PS：我使用铬。我还检查了 Firefox 和相同的行为。

【问题讨论】：

你能在 jsfiddle.net 创建一个完整的例子吗？请？一个“视频”的字数超过一百万。
@reporter 我无法提供完整代码，因为它是办公室代码，我可能无权共享整个代码。我看看能不能拍个视频。
然后用虚拟值替换官方值。我们只对浏览器收到的html源代码感兴趣。

标签： javascript jquery ajax-upload

【解决方案1】：

打开ajaxupload的插件文件..

在定义 mousemove 事件处理程序的函数中，找到注释： // 鼠标左键

将下一行更新为超过=真；

【讨论】：

这部分解决了问题，但重点有点偏向下方。我的意思是顶部按钮的一小部分仍然不起作用，而底部按钮之后的一小部分起作用！

【解决方案2】：

不完全是一般问题的解决方案，但就我而言，我只是更改了 2 行并适用于我的场景。

将行号 368 和 369 更改为

if ((c.x >= box.left-5) && (c.x <= box.right) && 
        (c.y >= box.top-10) && (c.y <= box.bottom)){

它显然会起作用。

【讨论】：