Dieser Artikel bietet hauptsächlich eine detaillierte Analyse und Einführung in den Unterschied zwischen keyUp und keyDown in JQuery. Freunde, die ihn benötigen, können ihn besuchen und hoffen, dass er für alle hilfreich ist
Definition und Verwendung
Der gesamte Tastendruckvorgang ist in zwei Teile unterteilt: 1. Die Taste wird gedrückt. 2. Die Taste wird losgelassen.
-Taste gedrückt wird.
Die Methode keydown() löst das Keydown-Ereignis aus oder gibt eine Funktion an, die ausgeführt werden soll, wenn das Keydown-Ereignis auftritt. Der Code lautet wie folgt:
<html>
<head>
<script type="text/
javascript
" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(
document
).ready(function(){
$("input").keydown(function(){
$("input").css("
background-color
","#FFFFCC");
});
$("input").keyup(function(){
$("input").css("background-color","#D6D6FF");
});
});
</script>
</head>
<body>
Enter your name: <input type="text" />
<p>当发生 keydown 和 keyup 事件时，输入域会改变颜色。请试着在其中输入内容。</p>
</body>
</html> Wie wir alle wissen, kapselt JQuery viele Ereignisinteraktionsmethoden, und die hier erwähnten Probleme treten auch in nativem JS auf.
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>无标题页</title>
<script src="JS/jquery-1.4.2.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$('#t1').live('keyup', function() {
$('#v1').text($(this).val());
});
$('#t2').live('keydown', function() {
$('#v2').text($(this).val());
});
$('#t3').live('keypress', function() {
$('#v3').text($(this).val());
});
});
</script>
</head>
<body>
<textarea id="t1"></textarea>
<p id="v1">
</p>
<textarea id="t2"></textarea>
<p id="v2">
</p>
<textarea id="t3"></textarea>
<p id="v3">
</p>
</body>
</html>Hier werden jeweils drei Ereignisse angewendet, von denen t1 vollständig mit v1 synchronisiert werden kann, während Tastendruck und Tastendruck immer erfolgen weniger letztes Ein Zeichen, das den kleinen Unterschied in der Auslösung dieser drei Ereignisse verdeutlicht, wenn gedrückt wird, und das endgültige Eingabeergebnis kann nicht erhalten werden.
Dies liegt an der Keydown-Operation. Schließlich wird das Ereignis ausgelöst, der Wert wurde jedoch noch nicht im Textfeld angezeigt, sodass diese Art von Operation eine vollständige Eingabe mit Keyup vor dem Wert des Textfelds erfordert erhalten werden kann.
Tastendruck und Tastendruck eignen sich eher für die Implementierung seitenähnlicher Funktionen durch Tastatursteuerung.
Lassen Sie die Taste auf der Tastatur drücken:
Der Code lautet wie folgt:
Bitte geben Sie einige Zeichen ein, wie Sie möchten:<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("input").keydown(function(event){
$("p").html("Key: " + event.which);
});
});
</script>
</head>
<body>Während Sie Text in das Feld oben eingeben, zeigt das p unten die Schlüsselnummer an.