浏览器自动完成/保存的表单在ajax请求中不起作用

Question

在搜索引擎中搜索关键字的任意组合真的很难，因为大多数热门开发者使用它想要ajax自定义自动填充。

大多数开发人员搜索自定义自动完成以从ajax获取db的结果，或者由于安全原因如何禁用浏览器自动完成，或者他们想要使用其他自动完成扩展程序。

但我不是在谈论自动完成。我发现简单的普通浏览器自动完成或浏览器保存的形式IE或FF，在填写文本框中的文本时将作为下拉列表的最新选择。

在登录表单中填写用户名和密码等表单非常简单。提交表单后（表单数据发布）浏览器将保存自动完成或FF中的事件将要求保存以及密码。

现在，考虑通过ajax提交的登录信息。表单数据不会由IE或FF自动保存，因为表单不是通过post方法发送的。我很确定这是因为ajax vs post方法。

像使用这种方式的DotNetNuke这样的CMS，我很难输入5用户登录用户名和密码用于开发目的，事件我想让用户在浏览器中保存自己的表单数据而不需要任何自定义或扩展程序。通过另一个示例，用户可以查看和使用相同的电子邮件来填写网站或域中的任何电子邮件表单。

如何解决这个问题？ 您有没有建议哪些关键字更适合搜索？

CallMeLaNN

Answer 1

我遇到了同样的问题。我能够通过添加一个隐藏的iframe来解决FireFox，我在做AJAX帖子之前通过JavaScript提交了这个iframe。我还没有找到任何适用于Chrome / IE的内容。

Answer 2

我一直面临同样的问题并且搜索了一下。我认为如果你有一个登录页面，下面的解决方案是最方便的解决方法。如果我们考虑通过ajax提交的登录，则没有任何浏览器记住或提供用户名和密码字段的自动编译功能，另外要求记住凭据。但是如果你使用javascript提交功能（可能它与旧版本的浏览器不兼容），所有浏览器都提供保存除IE以外的用户名和密码。但我发现IE的另一个棘手的问题是提供保存用户名和密码。

在我的登录页面中，我已经处理了用户名和密码，并通过ajax请求将它们发送到服务器端，如果登录成功，我通过以下方法提交表单，否则会向用户显示一个警告框登录失败。

请检查以下链接：

  

[编辑]：链接已损坏

在链接的页面中有关于此问题的固定页面，由于我的声誉，我无法再为您提供其他链接。请在页面中搜索以下报价：

  

查看固定页面。

当然，如果由于表单提交而在默认页面中有登录部分，则此方法不适用。这会导致页面闪烁。我想知道是否有人对此有所了解？

Answer 3

以下是一些不显眼的js jQuery代码，它将通过ajax（$ .post方法）将表单提交到真正的后端脚本，并通过iFrame提交给虚拟脚本，因此浏览器将保存提交的数据以供后续自动完成

这在chrome下工作得很好。任何反馈都非常欢迎！

var  formframesindex = 0;
function onSubmitAjax(evt){
    var $form = $(this);
    var framesubmitting = $form.hasClass('framesubmitting');
    var action = $form.attr('action');
    var original_action = action;

    if(!framesubmitting){
        $.post(action,$form.serialize()+"&ajax=1", function(responseText,message,request){
            formResponseHandler(responseText);
        }, "json");


        formframesindex++;
        var formframe = $("<iframe name='formframe_id_"+(formframesindex)+"' id='formframe_id_"+(formframesindex)+"' class='formframe' src='/fakeformreceiver.php'></iframe>");
        $('body').append(formframe);
        var target = $form.attr('target');
        $form.data('originaltarget',target);
        $form.data('originalaction',original_action);
        $form.attr('target','formframe_id_'+formframesindex);
        $form.attr('action','/fakeformreceiver.php');
        $form.addClass('framesubmitting');
        $form.submit();

    } else {
        var current_target = $form.attr('target');
        var original_action = $form.data('originalaction');
        var original_target = $form.data('originaltarget');
        var $frame = $('#'+current_target);
        setTimeout(function(){
            if($frame && $frame.length){
                $frame.remove();
            }
            $form.attr('action',original_action);
            $form.attr('target',original_target);
            $form.removeClass('framesubmitting');
        },100);
    }
    return framesubmitting;
}