Question

我确定这是我所缺少的愚蠢的东西。

我正在写一个小片段，在从输入字段获取的字符串中添加连字符。仅当我们到达第4位时才添加连字符，因此我可以键入123，连字符将不会出现。如果输入1234，它将自动更改为1234-。问题在于处理粘贴，在jQuery内部某行（执行我的代码后），它向该字段中注入了更多字符。

我的方法很简单。我查看keyup和keydown事件，检查输入并插入连字符。对于粘贴，我甚至会查看粘贴，抓取字符串，将其拆分并根据是否存在连字符插入连字符。

$('[id$="field"]').on('paste', function (event) {
    var element = this;
    var text = event.originalEvent.clipboardData.getData('text').split('');

    if (text.length > 4 && text.indexOf('-') < 0) {
        text.splice(4, 0, '-');
        $(element).val(text.join(''));
    }
});

$('[id$="field"]').bind('keyup keydown', function (event) {
    var input = $(this).val();

    if (input.length === 4 && event.keyCode !== 8) {
        $($(this).val(input + '-'));
    }
});

keyup和keydown侦听器可以正常工作。如果我粘贴12345，则当我打$(element).val(text.join(''));时最终得到1234-5，但随后在jQuery执行此操作时会弹出额外的字符。

我很困惑。

有什么想法吗？

Answer 1

由于要通过直接更新输入框的值来覆盖典型的“粘贴”行为，因此需要防止“默认”粘贴行为。

$('[id$="field"]').on('paste', function (event) {
    event.preventDefault();
    // ...

将字符注入到输入字段中

1 个答案: