HTML - onpaste事件删除额外的空格

Question

我有一个有额外空格的输入文本字段，

12 12 12

在粘贴到我的文本字段后，我想删除额外的空格。

121212

然而，我的代码似乎不适合我。

<input type="text" id="text1" onPaste="try123(this.id);"/>​

JavaScript

​

function try123(fId) {
cleanExtraSpace = function (e) {
        e.preventDefault();
        var pastedText = '';
        //IE browser OnPaste Event Handler
        if (window.clipboardData && window.clipboardData.getData) { 
        pastedText = window.clipboardData.getData('Text');
      } else if (e.clipboardData && e.clipboardData.getData) {
        pastedText = e.clipboardData.getData('text/plain');
      }
        //Remove start and end extra spaces on paste
        this.value = pastedText.replace(/\D/g, '');
    };
fId.onpaste =  cleanExtraSpace;
}

<input type="text" id="text1" onPaste="try123(this.id);"/>​

​

我指的是这篇文章，JavaScript - Remove Space on paste

有人能帮我纠正一下吗？

提前谢谢。

Answer 1

试试看以下几点。

输入：<input type="text" id="nums" name="nums">

var input = document.getElementById('nums');

function handleInput(e) {
  var el = this;

  window.setTimeout(function() {
    el.value = el.value.replace(/\D/g, '');
  }, 0);
}

input.addEventListener('paste', handleInput, false);

下面是一个活生生的例子：http://jsbin.com/lozobamequ/1/edit?html,js,output

Answer 2

试试这个。

HTML

<input type="text" id="search" name="search">

Javascript

document.getElementById('search').addEventListener('paste', handlePaste);

function handlePaste(e){
    e.preventDefault();
    var clipboardData = e.clipboardData || window.clipboardData;
    var pastedData = clipboardData.getData('Text');
    var searchField = document.getElementById('search');
    searchField.value = pastedData.trim();
}

使用它，您可以删除额外的空格(键盘粘贴以及鼠标粘贴)。