2017-08-18 2 views
1

Ich mache die gleiche Funktionalität, die eine Befehlszeile hat. Wenn Sie einige Befehle eingeben und dann die Taste drücken, wird Ihr vorheriger Befehl angezeigt.Platzieren Sie den Cursor am Ende des Textes auf der Tastatur

Jetzt habe ich alles funktioniert und es funktioniert gut, aber ich habe ein kleines Problem angetroffen.

Das Problem, das ich jetzt begegnen, ist, dass, wenn die up Taste drücken, wird der Cursor an der des Befehls beginnen platziert wird, während, wenn die down Taste, der Cursor am Ende des comand platziert wird.

Das erwartete Verhalten ist, dass der Cursor für beide auf Ende platziert wird.


Was unterscheidet dies von anderen Fragen?

  • Der Fokus liegt bereits auf dem Eingabefeld.
  • es mit der Ab-Taste

setTimeout(function() { 
 
var inputs = document.querySelectorAll('input'); 
 

 
inputs[0].onkeydown = function(e){ 
 
    //keyup 
 
    if(e.keyCode == 38) { 
 
    inputs[inputs.length-1].value = 'up pressed'; 
 
    } 
 
    
 
    if(e.keyCode == 40) { 
 
     inputs[0].value = 'down pressed'; 
 
    } 
 
} 
 
}, 1000);
<!DOCTYPE html> 
 
<html> 
 

 
    <head> 
 
    <link rel="stylesheet" href="style.css"> 
 
    <script src="script.js"></script> 
 
    </head> 
 

 
    <body> 
 
    <input type="text" placeholder="press the up or down key"/> 
 
    </body> 
 

 
</html>

+0

Können Sie ein komplettes Arbeitsbeispiel liefern und nicht nur ein Teil des Javascript funktioniert ? Es wird einfacher sein, auf diese Weise zu helfen – Dekel

+0

@Dekel in einem Schnipsel hinzugefügt – Ivaro18

Antwort

2

setTimeout(function() { 
 
var inputs = document.querySelectorAll('input'); 
 

 
inputs[0].onkeydown = function(e){ 
 
    //keyup 
 
    if(e.keyCode == 38) { 
 
    // placed here, it prevents the key's default behaviour to go at the end of the input text 
 
    e.preventDefault(); 
 
    inputs[inputs.length-1].value = 'up pressed'; 
 
    } 
 
    
 
    if(e.keyCode == 40) { 
 
     inputs[0].value = 'down pressed'; 
 
    } 
 

 
} 
 
}, 1000);
<!DOCTYPE html> 
 
<html> 
 

 
    <head> 
 
    <link rel="stylesheet" href="style.css"> 
 
    <script src="script.js"></script> 
 
    </head> 
 

 
    <body> 
 
    <input type="text" placeholder="press the up or down key"/> 
 
    </body> 
 

 
</html>

+0

oh wow ... okay ... wissen Sie zufällig, warum dies das Standardverhalten ist? – Ivaro18

+0

Beginnen Sie, einen Kommentar hinzuzufügen und drücken Sie auf und ab, Sie werden sehen :) – Vega

Verwandte Themen