如何在按键修改后获取HTML输入的新值？

我有一个HTML输入框如何在按键修改后获取HTML输入的新值？

<input type="text" id="foo" value="bar">

我已经附加了“KEYUP”事件的处理程序，但如果我在事件处理过程中检索输入框的当前值，我得到的值因为它是，而不是它会！

我试着拿起'keypress'和'改变'事件，同样的问题。

我敢肯定这很容易解决，但目前我认为唯一的解决方案是我将使用短暂的超时在未来几毫秒内触发一些代码！

有没有办法在这些事件中获取当前值？

编辑：看起来像我有我的js文件的缓存问题，因为我后来检查相同的代码，它工作得很好。我会删除这个问题，但不知道是否会失去代表发布想法的那类人的代表:)

来源

2008-10-21 Paul Dixon

你可以发布你的代码吗？我没有发现任何问题。测试在Firefox的3.01/Safari浏览器3.1.2：

function showMe(e) { 
// i am spammy! 
    alert(e.value); 
} 
.... 
<input type="text" id="foo" value="bar" onkeyup="showMe(this)" />

来源

2008-10-21 17:45:01 Owen

我回家了，检查了我的代码出了颠覆，它工作得很好。我认为我必须对js文件有一个缓存问题，并且它坚持处理按键而不是按键。感谢编写示例代码的努力，因此将其标记为答案:) – 2008-10-21 20:08:28

Here是不同的事件和浏览器支持的水平的表。您需要选择至少在所有现代浏览器中支持的事件。

正如您从表格中看到的那样，keypress和change事件没有统一支持，而keyup事件没有。

另外，还要确保您使用的是一个跨浏览器兼容的方法连接事件处理程序...

来源

2008-10-21 17:45:02 domgblackwell

<html> 
    <head> 
     <script> 
     function callme(field) { 
      alert("field:" + field.value); 
     } 
     </script> 
    </head> 
    <body> 
     <form name="f1"> 
      <input type="text" onkeyup="callme(this);" name="text1"> 
     </form> 
    </body> 
</html>

看起来你可以使用的onkeyup获得HTML输入控制的新值。希望能帮助到你。

来源

2008-10-21 17:47:01

你可以试试这个代码（需要的jQuery）：

<html> 
<head> 
    <script type="text/javascript" src="jquery.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $('#foo').keyup(function(e) { 
       var v = $('#foo').val(); 
       $('#debug').val(v); 
      }) 
     }); 
    </script> 
</head> 
<body> 
    <form> 
     <input type="text" id="foo" value="bar"><br> 
     <textarea id="debug"></textarea> 
    </form> 
</body> 
</html>

来源

2008-10-21 17:51:51

有两种输入值：字段的财产和字段的html 属性。

如果你使用keyup事件和field.value，你将得到该字段的当前值。当您使用field.getAttribute（'value'）时，情况并非如此，它会返回html属性（value =“”）中的内容。该属性表示输入到字段中的内容，并且在键入时发生更改，而属性不会自动更改（您可以使用field.setAttribute方法更改它）。

来源

2008-10-21 18:00:56 pawel

给出一个现代方法来解决这个问题。这效果很好，包括Ctrl + v。 GlobalEventHandlers.oninput。

var onChange = function(evt) { 
    console.info(this.value); 
    // or 
    console.info(evt.target.value); 
}; 
var input = document.getElementById('some-id'); 
input.addEventListener('input', onChange, false);

来源

2015-11-26 18:51:49

如何在按键修改后获取HTML输入的新值？

回答

相关问题