有没有办法使用回车键隐藏表单提交上的本机浏览器表单输入自动完成

时间:2014-07-10 10:58:17

标签: javascript jquery html forms autocomplete

我想隐藏原生浏览器自动填充(如果已显示)并且用户点击返回提交表单。

如果我的表单看起来像这样:

<form id="test-form" method="POST">
<input type="text" name="autoCompleteTestThang"/>
<button class="btn" type="submit" name="autoCompleteTestThang">Click Mee</button>

我的js喜欢这样:

$('#test-form .btn').click(function(event){
event.preventDefault();

// I'd be an ajax request really
console.log('Event Handled');
});

http://jsfiddle.net/7kC83/

情景:

  • 填写表单中的用户类型和本机浏览器自动填充

  • 用户点击进入以提交表单

  • 由于这是一个ajax调用event.preventDefault();会阻止所有默认表单事件处理

  • 自动填充建议列表仍然存在且用户必须点击以取消焦点并删除...我不想要的。

这是否可以隐藏自动完成功能,或者我只需将其关闭就像:

<input type="text" name="noAutoComplete" autocomplete="off" />

我知道我可以这样做并添加自定义自动填充功能。但如果我可以避免它,我希望使用原生自动完成功能。

1 个答案:

答案 0 :(得分:2)

在提交输入时使用.blur().focus(),自动填充功能会在最新版本的Chrome中消失。但是Haven在其他浏览器中测试它。

$('#test-form .btn').click(function(event){
    event.preventDefault();
    console.log('Event Handled');
    $('input:first').blur();
    $('input:first').focus();
});

DEMO