标准表单提交与Ajax表单提交-浏览器自动保存/建议用户输入



我们大多数使用与ajax结合的表单的人可能注意到,浏览器在以后的会话中不会保存/建议用户提交的输入。当涉及到"登录"页面时,这是一种失败。浏览器通常提供保存用户名/密码,这非常方便,但使用ajax表单提交。。。。好吧,你知道,这根本不会发生。

这个问题我已经看了两遍了,但仍然没有答案。自从被问到这个问题以来,已经有9个月了,我知道这里有很多聪明的人。所以……我决定重新提出这个问题。

我们能做些什么来解决这个问题?我们能以某种方式欺骗浏览器吗?

我愿意在这方面来回工作,因为我知道有一个工作解决方案供我们所有人使用会很好。

最终解决方案基于slashingweapon的答案(谢谢伙计!)

HTML-使用自定义按钮提交,没有表单"操作"或"方法",只有ajax

<form id="signin">
<label for="username">Username</label>
<input type="text" id="username" name="username" />
<label for="password">Password</label>
<input type="password" id="password"  name="password" />
//Custom Styled Submit Button
<img id="submit" class="form_button" src="btn_txt_sign_in.png" alt="Sign In" tabindex="3" />
//Hidden Standard Form Submit Button
<input id='trigger' type='submit' style='display:none;' />
</form>

JQuery

// Bind a click to the Custom Submit Button
$('#submit').click( function() {
//Trigger a Click on the Hidden Standard Form Submit 
$('#trigger').click();
});
// Detect when the form attempts to be submitted
$('#signin').submit( function(e){
// Prevent Standard Form Submission
e.preventDefault();
// Perform Function containing Ajax Submission instead
submit_signin();
});
// Ajax Submission
function submit_signin() {
//My Ajax Call....
}

当单击提交类型的任何按钮时,将提交封闭表单。您可以选择处理提交事件,而不是按钮的单击事件。这里有一个例子:

$('#demoForm').submit(function(evt) {
evt.preventDefault();
var data = $(this).serialize();
alert(data);
});​

还有一个Fiddle给你。

通过捕捉稍后的事件,您将确保至少某些浏览器有机会存储表单数据,以便将来自动填充。

最新更新