【问题标题】:How to disable twitter bootstrap email validation popover?如何禁用 twitter 引导电子邮件验证弹出框?
【发布时间】:2014-04-25 11:40:47
【问题描述】:

我有一个电子邮件类型的表单字段用于登录。我们还允许用户使用他们的昵称和电话号码登录。

问题在于,如果电子邮件字段中的格式不是电子邮件(不包含“@”),Twitter 引导程序会自动阻止表单提交。

有什么方法可以在点击我的“登录”按钮时禁用这个 twitter .js 绑定?

现在已经在谷歌上搜索了大约 2 个小时,但找不到任何解决方案,因此我将非常感谢任何答案!

【问题讨论】:

  • 只需在表单中使用novalidate标签,或将type="email"更改为type="text"并在移动设备中丢失键盘建议

标签: javascript jquery twitter-bootstrap ruby-on-rails-4


【解决方案1】:

文本类型是不好的电子邮件用户体验

<input type="text" />

这个文本类型还不错。但是在移动网页中,这个&lt;input&gt; 标签将显示键盘,只是普通的text 而不是email。 这是什么意思?手机键盘没有显示@,请用户滑动键盘输入@。他们不能使用autocomplete。这是糟糕的用户体验。

解决方案

&lt;form&gt; 标记中使用novalidate="novalidate" 属性。此属性在提交时跳过验证。以下是示例。

<form novalidate="novalidate" class="simple_form new_user">
  ...
</form>

如果你使用 rails ERB simple-form,那么你可以像这样使用novalidate

<%= simple_form_for(resource, html: { novalidate: true }) do |f| %>
  ...
<% end %>

参考

【讨论】:

    【解决方案2】:

    直接使用不带email属性的html:

    <input type"email" /><!--will block-->
    <input type="text" /><!--will not block-->
    

    【讨论】:

    • 我知道,但由于大多数用户使用电子邮件登录,我希望通过显示适当的键盘(带有 @ 符号)使他们在移动设备上的体验更加流畅。感谢您的回答!
    • with type text 也将接受@作为电子邮件....所以,您需要使用不验证或验证您可以使用文本类型....
    • type="text" 是否也会在带有@符号的智能手机上显示键盘?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-03-21
    • 2017-11-09
    • 2020-04-15
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多