onKeyPress 和 onKeyUp 之间的区别
Difference between onKeyPress and onKeyUp
我试图弄清楚onKeyPress和onKeyUp之间的区别。 我知道onKeyPress发生在操作提交之前,onKeyUp发生在之后。
我的问题是按下回车按钮时会发生什么?
如果我使用 onKeyPress,我的代码工作正常,提交按钮被禁用。如果我使用 onKeyUp,它会提交它,但由于某种原因,提交按钮仍然处于活动状态。
这是代码:
<script type="text/javascript">
function InformUser()
{
window.document.getElementById("loadingMessageDIV").style.display = "block";
<%=Page.GetPostBackEventReference(btnSubmit as Control)%>
document.getElementById("btnSubmit").disabled = true;
}
function validateTxt() {
var input = document.getElementById("<%=txtUserName.ClientID %>").value;
if(input.length > 0)
{
document.getElementById("btnSubmit").disabled = false;
}
else
{
document.getElementById("btnSubmit").disabled = true;
}
}
</script>
这是调用 validateTxt(( 的文本框
<asp:TextBox ID="txtUserName" runat="server" Font-Size="11pt"
onkeyup="validateTxt()"></asp:TextBox>
这是提交按钮
<asp:Button ID="btnSubmit" runat="server" OnClientClick="InformUser();" OnClick="btnSubmit_Click"
Text="Login" Font-Bold="True"/>
<script type="text/javascript">
document.getElementById("btnSubmit").disabled = true;
</script>
所以回顾一下:如果我将 onkeypress 更改为 onkeyup,我可以获得捕获退格键的能力,但是当我按回车键时,提交按钮仍然处于活动状态。
如果我将 onkeyup 更改为 onkeypress,那么我就可以按 Enter 并停用提交按钮。 缺点是我无法捕获退格键。
谢谢!
溶液:
多亏了护套,才想通了。
我不得不将onkeyup与检查一起使用,而不是回车键
function validateTxt(event) {
var input = document.getElementById("<%=txtUserName.ClientID %>").value;
var key = event.keyCode || event.which;
if(input.length > 0 && key != 13)
{
document.getElementById("btnSubmit").disabled = false;
}
else
{
document.getElementById("btnSubmit").disabled = true;
}
}
有趣的事实:keypress
事件不是任何标准的一部分,因此浏览器供应商可以自由地让它按照自己喜欢的方式运行。 不过,通常keypress
只对具有可打印表示形式的键触发。 如果要捕获不可打印的按键(箭头键、控制键、退格键等(,则需要keyup
(或keydown
(。
你不能用onkeydown
吗? 或者使用onkeyup
并检查回车键(e.keyCode
13(?
其他注意事项:
按住密钥时,keypress
和keydown
将反复触发,而keyup
只触发一次。
MDN有一个方便的综合键盘事件指南,包含更多信息。
- 当按下键盘上的任何键时,onKeyPress被触发
- onKeyUp 在您松开键盘上的键时触发。如果您按任何键,不要释放它,onKeyPress将被触发,但也不会被触发。
您可能更愿意在表单中提交时执行验证。
keypress
仅适用于没有元键的字母、数字和符号
keyup
适用于键盘上的所有键
在这个小提琴中使用了jQuery
- 全局变量和全局对象的属性之间有什么区别吗
- JavaScript中的函数和对象之间没有区别吗?
- 在下划线中使用_(obj).map(callback)和_.map(obj,callback)之间的区别
- javascript函数的:和=之间的区别
- 什么's本地node.js服务器和python简单http服务器之间的区别
- 函数中this和var之间的区别
- “util.inherits”和在NodeJS中扩展原型之间的区别
- Math.min()和Math.max()之间有什么区别?在Javascript中
- webpack开发模式和生产构建模式之间有什么区别
- servlet和代理servlet之间的区别
- Javascript 类型未定义和 void 之间的区别
- Javascript-defineProperty和直接在对象上定义函数之间的区别
- 关于承诺/A+规范,术语“当时可”和“承诺”之间有什么区别
- 布局引擎和javascript引擎之间的区别
- 什么's extjs中的mon()和on()之间的区别
- type=text/javascript和language=javascript之间的区别
- 函数()和新函数()之间的区别
- JavaScript中let和var之间的区别
- 蓝鸟的done()和spread()之间的区别
- Node.js HTTP/NET——连接和请求之间的区别