Question

我正在处理图片上传网站。当用户上传图像没有问题时，它会在4个不同的文件夹中以4种不同的尺寸保存图像。之后，它们将被重定向到包含新内容的同一页面。现在他们将裁剪图像。图像裁剪功能正常工作。我已经做了一个功能来检查用户是否离开了网站。如果他们这样做，3个函数将通过AJAX脚本删除4个存储的图像。

代码：

function unfinished(album, img) {
    window.onbeforeunload = function(e) {
        e = e || window.event;
        var response = '';
        var xmlhttp;
        if (window.XMLHttpRequest) {
            // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp = new XMLHttpRequest();
        } else {
            // code for IE6, IE5
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange = function() {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                response = xmlhttp.responseText;
            }
        }
        xmlhttp.open("GET", "incl/unfinished.php?a=" + album + "&i=" + img, true);
        xmlhttp.send();
        // For IE and Firefox prior to version 4
        if (e) {
            e.returnValue = response;
        }
        // For Safari
        return response;
    }
}

我的问题是，当他们点击“保存裁剪”按钮时也会触发此功能。当然，这不是我想要的。

单击保存按钮时如何使功能不弹出的任何解决方案？

如果重要，我通过以下方式运行未完成的功能：

onload='onfinished("$nameonalbum","Filename")'

我的保存裁剪html代码：

input type="submit" name="upload_thumbnail" value="Save crop" id="save_thumb"

欢迎任何帮助。感谢您的耐心和理解。

Answer 1

由于Ajax请求和事件处理，当前的流程很复杂。

您可以将流程更改为以下内容。

用户在upload.php
upload.php
1. 创建原始图像的4个版本
2. 使用TIMESTAMP
3. 删除TIMESTAMP早于1 day的数据库中的所有NOT_CROPPED类型图像。自己定义此持续时间。
upload.php使用新的裁剪工具加载回来
“提交所有4张图片”状态更新为COMPLETE。

Answer 2

我必须在一个案例中做一些类似于你的事情，所以我创建了一个变量unload = true和页面的开头，然后我将其更改为<input type="submit"而不是<input type="button" onclick="runFunction();"然后在我的

function runFunction() {
unload = false;
$('#form').submit();
};

然后我会在if(unload) { ...do stuff here }

中添加onBeforeUnload()

如何检查是否单击了提交，因此我的功能不会触发？

2 个答案: