时间戳

首页 > 解决方案 > JQuery 屏蔽输入在 Rails 6 中不起作用

javascript - JQuery 屏蔽输入在 Rails 6 中不起作用

问题描述

我正在尝试在 Rails 6 上的表单中使用 JQuery Masked Input。但在我看来，资产中的application.js不起作用，我不确定。我使用以下命令通过 yarn 安装了插件：yarn add jquery-mask-plugin. 它作为依赖项包含在package.json中。

要进行设置，我去了app/assets/javascripts/application.js。这是文件：

//= require jquery
//= require jquery_ujs
//= require jquery-mask-plugin
//= require_tree .

$.jMaskGlobals.watchDataMask = true;

在app/javascript/packs/application.js我尝试导入 JQuery 和插件：

require("@rails/ujs").start()
require("turbolinks").start()
require("@rails/activestorage").start()
require("channels")
require("jquery")
import 'inputmask';

现在以我的形式，这就是我尝试使用插件的方式：

<%= form.text_field :cpf, class:'form-control', 'data-mask': '999.999.999-99' %>

正如我之前所说，我不确定，但我认为问题在于资产中的application.js文件，因为我编写了一个console.log("test")命令只是为了查看它是否正在执行，而当服务器运行时，Web 控制台上什么也没有出现。

有人可以帮助我吗？

标签： javascriptjqueryruby-on-railsmaskedinputembedded-ruby

解决方案

  1. 纱线添加“jquery-mask-plugin”
  2. 在 app/javascript/packs/application.js

添加要求

require("jquery-mask-plugin")
  1. 在 app/javascript/packs/application.js

在底部添加行

$.jMaskGlobals.watchDataMask = true;

  1. 在 .html.erb 中

    = d.text_field：电话号码，自动完成：“电话号码”，类：“表单控件”，占位符：“03xx-xxxxxxx”，“数据掩码”：“0000-0000000”

或 在 html.erb

<%= d.text_field :phone_number, autocomplete: "phone Number", class: "form-control", placeholder: "03xx-xxxxxxx" , 'data-mask': '0000-0000000' %>

推荐阅读