1

我在整个代码中一直在使用它，没有任何问题：

// alerts
window.cAlert = function (msg) {
    // insert
align.append("<div id=\"alert\">" + msg + "</div>");
    // object
    alertBody = $("#alert");
    // css values
    alertTop = (wh - alertBody.outerHeight()) / 2;
    alertLeft = (ww - alertBody.outerWidth()) / 2;
    // alert css
    alertBody.css({
        top: alertTop,
        left: alertLeft
    }).transition({
        opacity: 1
    }, 300);
    // delete alert
    $(window).on("click scroll touchstart resize", function (e) {
        alertBody.transition({
            opacity: 0,
            x: -(ww / 2),
            rotate: "-360deg"
        }, 600, function () {
            alertBody.remove();
        });
    });
}

但是在我的提交函数中，它没有按预期工作：

  $(document).on("submit", "#twigForm", function (e) {
     // fix
     e.preventDefault();
     // object
     var twigObj = $(this);
     // the file data
     var file = ($("#upload"))[0].files[0];
     // checks
     if(!file) {
         cAlert("You didn't select an image, silly");
     } else if(file.size >= 2097152) {
         cAlert("Filesize cannot exceed 2 MB");
     } else if(file.type !== "image/jpeg" && file.type !== "image/jpg" && file.type !== "image/gif" && file.type !== "image/png") {
         cAlert("Are you sure that's an image?");
     }
});

预期行为：当用户单击（任何地方）、滚动、触摸或调整窗口大小时，警报消息应该消失，它确实如此。但是，如果用户第二次在表单中出错，即使我没有滚动/调整大小/单击/等，警报消息也会立即消失。我什至没有抓住错误读到的内容。任何帮助表示赞赏。

4

2 回答 2

3

在设置事件处理程序时尝试使用.one()而不是。.on()您的代码将处理程序留在窗口上，所以我敢打赌，按钮上的“单击”正在触发上一次提交安装的处理程序，因此它立即开始倒计时以删除警报。

通过使用.one()，每个处理程序将只运行一次。

于 2013-09-14T16:47:08.717 回答
0

这是您的代码的工作演示：

 $(window).on("click scroll touchstart resize", function (e) {
        alertBody.transition({
            opacity: 0,
            x: -(ww / 2),
            rotate: "-360deg"
        }, 600, function () {

$(this).remove();

        });
    });

代替alertBody.remove, 使用$(this).remove(). 我已经修复了您原始演示中的一些拼写错误，并按预期工作

于 2013-09-16T07:02:58.953 回答