如果发生任何变化,我想捕获<textarea>.就像键入任何字符(删除,退格)或鼠标单击并粘贴或剪切一样.是否有可以触发所有这些事件的jQuery事件?
我尝试了更改事件,但只有在从组件中跳出后才会触发回调.
使用:如果<textarea>包含任何文本,我想启用按钮.
我对javascript中的游戏有一个想法(我将使用EaselJS制作它),我将不得不检测按键.在网上浏览后,我看到了很多建议(使用window.onkeypress,使用jQuery等),但对于几乎所有选项都有反驳.你们有什么建议?使用jQuery这听起来很容易,但我几乎没有使用该库的经验(我也不是特别是javascript的老手)所以我宁愿避免它.如果jQuery是最好的选择,有人可以给出一个很好的例子(解释会很棒)如何做到这一点?
我想这会被问到很多,但我找不到任何明确的答案.提前致谢!
相关:JavaScript KeyCode与CharCode
这里有一些你可以在家里或在jsfiddle中尝试的代码:
el.addEventListener( 'keyup', function( e ) {
console.log( 'Keyup event' );
console.log( e.keyCode );
} );
el.addEventListener( 'keypress', function( e ) {
console.log( 'Keypress event' );
console.log( e.keyCode );
} );
Run Code Online (Sandbox Code Playgroud)
为什么keyCode不同?
我可以理解为什么人们只应该使用按键,但我不明白的是,在键盘上给出相同的按键时,两个按键事件如何给出不同的keyCodes.
PS:我并不担心遗留的浏览器支持,我在Chrome中尝试了这个并且感到惊讶,并且找不到解释.
我一直在努力了解jQuery keypress,keydown,keyup和input事件.但我发现它们很混乱.有人可以指出确切的区别吗?此外,我想知道当用户粘贴一段文本时,所有这些都会被触发.
谢谢
我为此搜索了文档和问题,但很惊讶找不到一个。
在 React index.d.ts 文件中,它显示:
// Keyboard Events
onKeyDown?: KeyboardEventHandler<T>;
onKeyDownCapture?: KeyboardEventHandler<T>;
onKeyPress?: KeyboardEventHandler<T>;
onKeyPressCapture?: KeyboardEventHandler<T>;
onKeyUp?: KeyboardEventHandler<T>;
onKeyUpCapture?: KeyboardEventHandler<T>;
Run Code Online (Sandbox Code Playgroud)
我想使用 onKeyUp 但后来我注意到了两个版本。这和 onKeyUpCapture 有什么区别,一个比另一个有什么好处?我什么时候使用每个?
我使用了TextField反应材料-ui.我想知道用户是否按下了Ctrl + Enter.我尝试过使用onKeyPress事件但没有结果.我怎样才能做到这一点?
<TextField
value={this.state.message}
autoFocus={true}
hintText='Type your message here'
onChange={this.onChangeMessage}
onKeyPress={(event) => {
if (event.ctrlKey && event.keyCode == '13')
this.sendMessage();
}}
multiLine={true}
/>
Run Code Online (Sandbox Code Playgroud) 例如,如果我有这个:
<input type='text' onkeydown='doSomething()' />
<script>
function doSomething() {
// ?
}
</script>
Run Code Online (Sandbox Code Playgroud)
我需要以跨浏览器/ os方式按下keyCode /字符..如何做到这一点?我已经尝试过这个〜大约6年前,因为我记得那个时候,这并不容易,有时我必须通过事件或其他什么才能让它在Opera或IE cmiiw上运行
我遇到了这个问题:onKeyPress Vs. onKeyUp和onKeyDown,我发现keypress只要在文本输入中键入字符就会触发它.我试图运行以下代码.它应该在文本长度超过0时使输入的背景变为黄色,或者在它为0时使白色变为白色.我无法使其工作.如果我尝试做keydown,我有以下问题:
如果我只输入一个字符放开,背景仍为白色.
如果那时,我按下backspace,从而清除那一个字符,它变成黄色(正好与我想要的相反!).如果我现在按(Alt或Shift)任何其他键,它将再次变为白色.事实上,如果不是Alt或者Shift我输入一个角色,它仍将保持白色,将我们带回第一个问题.
如果我键入按下一个字符键并按住它,则第一个字符的背景保持白色,然后变为黄色的第二个字符.
如果我keyup只尝试,这些是问题(如预期的那样):
如果我尝试keypress,我面临同样的问题keydown,即使它应该工作.
如果我绑定3个处理程序keyup,keydown和keypress(上帝我绝望),几乎所有的问题都解决了,除了问题3 keydown:如果我键入按下一个字母键不放,背景仍然是白色的第一个字符,而变成黄色第二个字符开始.
我该如何解决这个问题?
JS:
$(document).ready(function() {
$("input").bind("keydown", function() {
if ($(this).val().length == 0) {
$(this).css('background', 'white');
} else {
$(this).css('background', 'yellow');
}
});
$("input").bind("keypress", function() {
if ($(this).val().length == 0) {
$(this).css('background', 'white');
} else {
$(this).css('background', 'yellow');
}
});
$("input").bind("keyup", function() …Run Code Online (Sandbox Code Playgroud) keypress不推荐使用javascript事件:https :
//developer.mozilla.org/en-US/docs/Web/API/Document/keypress_event
有些人建议完全依赖keydown事件,例如:
Keydown是我们唯一需要的键盘事件
https://www.mutuallyhuman.com/blog/2018/03/27/keydown-is-the-only-keyboard-event-我们需要/
问题是keydown和keypress不是同义词。至关重要的是,它们在许多/大多数情况下不会返回相同的字符。Keydown表示按下了键盘上的哪个键,而keypress表示用户实际键入的字符。
在英语中,区分大小写很重要:
letter = String.fromCharCode(event.which);
Run Code Online (Sandbox Code Playgroud)
当按下键盘上的“a”键时,字母是“a”加keypress,但它是“A”加keydown。
JCK 语言的情况变得更加复杂,因为keypress接收正确的国际键盘布局字符,而不是keydown将所有内容转换为单字节字符。
现在在 IME 组合过程中会触发 keydown 和 keyup 事件:https :
//www.fxsitecompat.com/en-CA/docs/2018/keydown-and-keyup-events-are-now-fired-during-ime-composition/
那么,随着keypress被弃用,当我们关心用户打算输入的字符时,我们应该使用什么,考虑大小写、非 ASCII 字符和多字节字符?
相关问题和参考:
keyup 事件总是返回大写字母
=> 答案推荐使用keypress.
String.fromCharCode 不适用于 keydown 事件
=> 答案建议使用keypress.
keypress 和 keydown 上的 String.fromCharCode 返回错误的字符
=> 答案指出keypress和keydown事件不可互换。
所以我是HTML5的新手,并决定开始编写乒乓球游戏.我想用键盘顺利移动我的角色,左边的W和S键以及右边的向上和向下箭头.我似乎无法让它发挥作用.这可能很容易,但我是我的菜鸟,我需要一些帮助.提前致谢!
<!DOCTYPE html>
<html>
<head>
<title>Pingedy Pong</title>
</head>
<body style="font-family:Arial;">
<canvas id="ctx" width="699" height="400" style="background-color:black;border:2px solid black;background-image: url('background.jpg');"></canvas>
<script>
// STARTING SCRIPT
var ctx = document.getElementById("ctx").getContext("2d");
ctx.fillStyle="white";
ctx.font = '30px Arial';
// VARIABLES
var keys1 = [];
var keys2 = [];
var width = 699;
var height = 400;
var ball = {
width:20,
height:20,
spdX:2.9,
spdY:2.9,
x:340,
y:190,
};
var char1 = {
w:15,
h:90,
spdX:3,
spdY:3,
x:10,
y:155,
};
var char2 = {
w:15,
h:90,
spdX:3,
spdY:3,
x:674, …Run Code Online (Sandbox Code Playgroud)我试图在特定的字符串中插入其他字符.
function sample(x) {
if (x.value.length > 2 && x.value.length < 5) {
var first = x.value.substring(0, 2) + "'";
var second = x.value.substring(2, x.value.length) + "''";
x.value = first + "" + second ; }
}Run Code Online (Sandbox Code Playgroud)
<input id="txt" type="text" placeholder="onkeypress" onkeypress="sample(this)" value="" /><br />
<input id="txt1" type="text" placeholder="onchange" onchange="sample(this)" value="" />Run Code Online (Sandbox Code Playgroud)
通过onchange在htmlinput中使用属性,代码运行完美.但这也可以用onkeypress属性运行吗?如果输入值为1006,则结果应为10'06''.救命.谢谢.
我有一个使用 jqlite 的 Angular 指令,我想绑定一个按键、按键和粘贴事件来更新指令上的选项。
我使用以下方法绑定到 paste、keypress 和 keydown 事件:
input.bind("paste.elementClass", updateOptions);
input.bind("keypress.elementClass", updateOptions);
// keypress does not fire if the backspace/delete button is pressed. This keydown listener triggers the
// keypress event if backspace/delete is pressed. Didn't use keydown listener instead of keypress because
// keydown did not register if multiple buttons are pressed (shift + d). The keyup event choked
// if a button was pressed and held for longer than the model debounce time.
input.bind("keydown.elementClass", function() { …Run Code Online (Sandbox Code Playgroud)