Question

有没有办法拦截用户在元素出现之前输入的值？我尝试使用Object.defineProperty，但它似乎不适用于InputElement.value，因为

var value;
Object.defineProperty($('input')[0], 'value', {
    get: function() {return value},
    set: function(val) {console.log(val); value = val;}
});

似乎没有改变任何行为。或者oninput / onchange是唯一的选择？因为我宁愿让我的代码在浏览器之前执行。

http://jsfiddle.net/zpmu1xcu/

Answer 1

如果要在浏览器输入文本之前检测输入，可以使用Element.onkeydown属性。在浏览器解释操作之前，一旦按下键，该事件就会触发。

var demo_i = document.getElementById('demo_i');
var demo_d = document.getElementById('demo_d');

demo_i.onkeydown = function(e) {
    demo_d.textContent = e.which;
    // Returning false stops the event from going any further
    return false;
}

<input id="demo_i"><div id="demo_d"></div>

Answer 2

这就是你要找的东西吗？

KafkaSpout

function InterceptInputValue($input) {
  var value = $input.val();
  // intercept value that changes and saved to value variable
  $input.keydown(function(e) {
    value += String.fromCharCode(e.keyCode);
    return false;
  });

  this.getValue = function() {
    return value;
  };
}

var i = new InterceptInputValue($("input"));

$("input").blur(function() {
  alert('input value is: ' + i.getValue());
});

Answer 3

我认为你唯一的选择是keyup。

它是唯一可以捕获数据并且不会留下任何数据的人。

使用下面的代码段，在每个文本框中输入测试代码尝试以使每个键击将值重置为空白。

keyup是唯一一个删除每个笔划输入的人。

离开字段后，

keydown清除最后输入的字符。

keypress会在input字段中输入最后一个字符

＆＃13;

var tbxKeyDown = document.getElementById('tbxKeyDown');
var tbxKeyUp = document.getElementById('tbxKeyUp');
var tbxKeyPress = document.getElementById('tbxKeyPress');

// [Jedi mind trick] ==> you entered nothing

tbxKeyDown.addEventListener('keydown', testKeyDown, false);
tbxKeyUp.addEventListener('keyup', testKeyUp, false);
tbxKeyPress.addEventListener('keypress', testKeyPress, false);

// Remove anything entered

function testKeyDown() {
  tbxKeyDown.value = '';
}

function testKeyPress() {
  tbxKeyPress.value = '';
}

function testKeyUp() {
  tbxKeyUp.value = '';
}

＆＃13;

KeyDown  = <input type="text" id="tbxKeyDown"  value="" />

<br/><br/>

KeyUp    = <input type="text" id="tbxKeyUp"    value="" />

<br/><br/>

KeyPress = <input type="text" id="tbxKeyPress" value="" />

＆＃13;

拦截输入进入

3 个答案: