聚合物纸输入掩模
[英]Polymer paper-input mask
问题描述
我正在使用Polymer（v1.4.0）进行项目，我想知道是否有任何方法可以为纸张输入添加输入掩码？
我已经尝试使用jquery.inputmask将它直接添加到paper-input的inputElement，但随后绑定和更改事件停止工作。
如果那是不可能的，你知道任何其他带掩码支持的文本输入Web组件吗？
谢谢！ 安德烈
3 个解决方案
解决方案1
3 2016-05-29 15:10:47
您可以使用gold-xxx-input元素作为模板，如何构建自定义蒙版输入元素https://elements.polymer-project.org/elements/gold-cc-input
解决方案2
1 2016-05-29 16:54:12
是的，你可以使用<paper-input>的allowedPattern和preventInvalidInput 。 例如，这会屏蔽非数字输入：
<head> <base href="https://polygit.org/polymer+1.9.3/components/"> <script src="webcomponentsjs/webcomponents-lite.js"></script> <link rel="import" href="paper-input/paper-input.html"> </head> <body> <paper-input label="enter an integer" prevent-invalid-input allowed-pattern="[\\d]+"></paper-input> </body>
解决方案3
0 2017-08-10 22:07:31
这是我在聚合物2和开箱即用的纸张输入中得到的结果，没有使用电话号码的自定义编码作为示例。 掩盖输入的近似近似，没有自动添加短划线（ - ）的超级好处。
纸输入掩码是需要的东西。
<head> <base href="https://polygit.org/polymer+1.9.3/components/"> <script src="webcomponentsjs/webcomponents-lite.js"></script> <link rel="import" href="paper-input/paper-input.html"> </head> <body> <paper-input auto-validate allowed-pattern="[0-9-]" pattern="\\d{3}[\\-]\\d{3}[\\-]\\d{4}" prevent-invalid-input label="Mobile Phone" placeholder="___-___-___" id="phoneNumber" type="tel" disabled$=[[disabled]] > </paper-input> </body>
聚合物焦点（） <paper-input> 要么 <core-input> 元件
[英]polymer focus() on <paper-input> or <core-input> element
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.