jEditable提交onBlur失败了ALT + TAB

时间:2012-10-25 13:25:02

标签: javascript browser submit jeditable onblur

我让jEditable与textarea一起正常工作来编辑对象内的内容。我正在使用jEditable的onblur选项将onBlur直接提交给一个函数(而不是一个url),并且所有工作都按预期工作,除非您使用for例如更改窗口。 ALT + TAB。当我使用alt + tab时,看起来内容是通过实际的http请求提交的,而忽略了我的回调函数。

我的基本示例实现如下:

$(".editable").editable(function(content,settings){
        content = content.replace(/\n/gi,"<br />");
        return content;
    },{
    data: function(value, settings) {
        return value.replace(/<br[\s\/]?>/gi, '\n');
    },
    type: "textarea",
    onblur: "submit"
});​

您可以在此处进行测试:http://jsfiddle.net/xmajox/wePp5/

我已经尝试过所有其他窗口操作:调整大小,移动等等,甚至在浏览器上的标签之间移动效果很好(提交数据并退出编辑模式)。

关于如何驯服它的任何想法?

更新: 经过几次测试和其他人的一些合作,似乎这取决于os(窗口管理器?)。它在ubuntu 12.10上一致发生,但在mac或windows上没有发生(没有测试过其他linux盒子)。

此外,现在证明我的回调方法确实在我使用alt-tab时运行,但表格后来无论如何都会获得POST。添加live preventDefault似乎没有帮助。

1 个答案:

答案 0 :(得分:0)

找到了解决这个问题的方法,但是我不太明白为什么会在这种特定情况下发生。

首先,我必须是世界上最幸运的人,因为我已经在其他组合的十分之一上尝试了这个并且它没有这个问题,只有我可以让它发生的地方是:

 Ubuntu 12.10 (with Unity) and Chrome (v22 at the time of this post)

免责声明:这并不意味着它不会在其他地方发生,我无法在我测试的那些地方重现它(或要求朋友测试)。

<强>问题: 当焦点丢失时,jEditable(从版本1.7.1开始)在实际执行任何操作(默认为200毫秒)之前设置超时,以防止根据源中的注释执行重复操作。如果你(使用上面的浏览器/ os组合)alt + tab超出浏览器窗口,在超时被触发之前(也就是在提交数据并运行你的方法之前),它会强制发出带有数据的POST请求,完全忽略preventDefaults或return falses。 如果按下alt,它将不会出现此问题...按住它(超过200毫秒,即足够时间触发超时)然后按alt移开。

<强>解决方案: 我编辑了jEditable的源代码以减少超时(甚至删除它)。所以我在280号线附近,它说:

(...)
    input.blur(function(e) {
         // prevent double submit if submit was clicked 
         t = setTimeout(function() {
              form.submit();
         }, 200);
    });
(...)

我把它改为:

(...)
    input.blur(function(e) {
        form.submit();
    });
(...)

备注: 我删除了这个,因为在我的情况下(仅在模糊时提交textareas而没有任何允许用户提交数据的其他控件)我不能重现Mika Tuupola在评论中提到的双提交问题。如果您有提交onBlur激活的文本输入字段(按提交输入),您可能会遇到这种情况。在这些情况下,我建议你只是减少超时或者只是避免使用onBlur提交。