jQuery预填充并格式化文本字段

Question

这令我感到困惑。

我有一个带有文本字段的PHP应用程序，客户端希望字段预先填充896-然后用户输入只有五个数值，所以它就像896-12569。 我

我想在jQuery中这样做，这有可能，如果是这样的话？

Answer 1

我建议使用CSS，但这是一个jQuery解决方案：

$('input').on('keyup', function() {
  var prefix = '896-';
  var value = this.value.replace(prefix, '').replace(/[^\d]/, '').substr(0, 5);
  this.value = prefix + value;
}).keyup(); // trigger the keyup event, so that the field is populated at load

显然交换相关选择器的input，并根据需要添加事件（此示例仅适用于keyup事件。）

---

修改

再次查看代码后，我注意到有一个小错误（按 backspace 一次），prefix再次添加（这是因为它没有从{删除} {1}}因为它不再匹配），快速解决方法是始终替换输入的前4个字符：

input

Answer 2

你不需要jQuery。

只需将896-放在输入字段之外，并将其设置为正常

<div class="controls">
    896-<input type="text" name="postfix" class="prefixed-input" />
</div>

然后，在PHP中，您可以在存储之前将896-加上前缀。

查看Bootstraps website上的示例。在“扩展表单控件”标题下。