rails视图中电话表单字段的输入掩码

Question

我的应用程序中有一个客户联系表单，当然需要电话输入。我正在运行Rails 3.2.13并使用Zurb Foundation。我希望找到一个以“[phone]”形式提供输入掩码的html" target="_blank">gem，我可以调用它。我的数据确实是本地的，所以我只需要美国格式的数字。

我能够在现场执行验证，但希望将用户限制在输入掩码的更严格范围内。这就是我目前所拥有的。

  <div class="large-4 columns"><%= f.telephone_field :phone, :placeholder => "Phone - [phone]" %></div>

这方面有什么好东西吗，或者你喜欢的jQuery插件？

干杯！

-编辑，这里是我需要完成的全部答案。以防万一有人正在寻找快速修复方法。这是我表格中的代码。html。erb视图文件：

<div class="large-2 columns">
   <%= f.text_field :phone, :id => "phone", :placeholder => "Primary Phone"%>
</div>

以下是我的资产/javascripts文件夹中我的咖啡文件中的代码：

$ ->
   $("#phone").mask("[phone]")

您需要下载适当的jquery。maskedinput。下面提到的链接@vinodadhikary中的js文件。然后，您必须在应用程序的依赖项列表中jquery文件下方的某个位置需要该文件。js文件如下：

//= require jquery
//= require jquery_ujs
//= require foundation
//= require jquery.maskedinput
//= require_tree .

就是这样。如果您发现任何错误，请让我知道，我会编辑。

Answer 1

我一直在使用插件http://digitalbush.com/projects/masked-input-plugin和它的工作相当好。

我有很多具有不同掩码的字段，因此我在应用程序coffescript中使用此方法。

  $( "[data-mask]").each (index, value) ->
    element = $(value)
    element.mask($(value).data('mask'))

现在，我可以在任何字段上设置数据掩码属性：

      <%= f.text_field(:phone, data: { mask: '[phone]' }) %>

我希望这能帮助某人！