使用 jQuery ruby​​ gem 设置输入掩码

Question

我一直在尝试在我的网站上为电话号码字段实施输入屏蔽。由于某些（可能是愚蠢的）原因，我无法让我的代码与 jQuery 插件链接。我下载了 Ruby gem 并完成了所有步骤，但我的浏览器显示未定义变量。我怀疑我没有正确设置 gem。

Github link

The main website for the functionality

我已将 gem 安装到我的 gemfile 中并运行 bundle

我已将调用包含在我的 application.js 中

然后尝试在我的代码中实现它

我知道它需要文件：jquery.mask.min.js，但无法将它与我的项目链接

如果有任何更简单的方法可以在 Ruby on Rails 中实现此功能，我很乐意使用它！

PS：经过长时间的休息后，我要重新开始编码，所以我在做这样简单的事情时遇到了麻烦！

<div class="form-group col-md-6">
<label>Phone</label>

<%= f.text_field :phone, class: 'control phone_us', maxlength: 20 %>

</div>

<script type="text/javascript">
  $(document).ready(function(){
    ('.phone_us').mask('(000) 000-0000');
  })
</script> 

Uncaught TypeError: ".phone_us".mask is not a function

    at HTMLDocument.<anonymous> (<anonymous>:3:19)
    at mightThrow (jquery3.self-e200ee796ef24add7054280d843a80de75392557bb4248241e870fac0914c0c1.js?body=1:3558)
    at process (jquery3.self-e200ee796ef24add7054280d843a80de75392557bb4248241e870fac0914c0c1.js?body=1:3626)

Answer 1

您似乎在('.phone_us') 前面缺少$。喜欢：

$('.phone_us').mask('(000) 000-0000');

此外，如果您使用的是 turbolinks，您可能需要监听 turbolinks:load 事件，例如：

$(document).on "turbolinks:load", ->
  alert "page has loaded!"

如5.2 Page Change Events 下的文档中所述。