답변:
이는 새 문자가 요소에 추가 되기 전에keypress 이벤트 가 시작되기 때문입니다 (따라서 첫 번째 문자가 추가되기 전에 첫 번째 이벤트가 시작되고 여전히 비어 있음). 대신 캐릭터를 추가 한 후에 시작 되는 대신 사용해야합니다 .valuekeypressvaluekeyup
요소 #dSuggest가 동일 input:text[name=dSuggest]하면이 코드를 상당히 단순화 할 수 있습니다 (그렇지 않은 경우 다른 요소와 이름이 같은 id요소를 갖는 것은 좋지 않습니다).
$('#dSuggest').keypress(function() {
var dInput = this.value;
console.log(dInput);
$(".dDimension:contains('" + dInput + "')").css("display","block");
});input이벤트 유형에 대한 실제 지원을 제안하는 내용이 없습니다 .
이 게시물이 다소 오래된 게시물이라는 것을 알고 어쨌든 같은 문제로 어려움을 겪고있는 해답을 제공 할 것입니다.
"input"대신 이벤트를 사용 하고 .on메소드에 등록해야합니다 . 지연이없고 빠르며 keyup최신 키 누르기 문제를 해결합니다.
$('#dSuggest').on("input", function() {
var dInput = this.value;
console.log(dInput);
$(".dDimension:contains('" + dInput + "')").css("display","block");
});.keyup키 누르기 대신 사용하십시오 .
$(this).val()또는 this.value현재 입력 값에 액세스하기 위해 또는 사용하십시오 .
여기 데모
.keypressjQuery 문서 에 대한 정보 ,
브라우저가 키보드 입력을 등록하면 키 누르기 이벤트가 요소로 전송됩니다. 키 반복의 경우를 제외하고는 키 다운 이벤트와 유사합니다. 사용자가 키를 길게 누르면 키 다운 이벤트가 한 번 트리거되지만 삽입 된 각 문자에 대해 별도의 키 누르기 이벤트가 트리거됩니다. 또한 수정 자 키 (예 : Shift)는 키 누르기 이벤트를 트리거하지만 키 누르기 이벤트는 트리거하지 않습니다.
keyup키가 너무 느리게 풀리면 키를 눌렀다가 놓지 않아도됩니다. keydown약간의 시간 초과 로 사용 하는 것이 더 좋으므로 실제로 값이 변경됩니다.
입력을 업데이트하려면 실행 스레드를 중단해야합니다.
$(document).ready(function(event) {
$("#dSuggest").keypress(function() {
//Interrupt the execution thread to allow input to update
setTimeout(function() {
var dInput = $('input:text[name=dSuggest]').val();
console.log(dInput);
$(".dDimension:contains('" + dInput + "')").css("display","block");
}, 0);
});
});keyup지연은 일부 목적으로 너무 느리고 수정 자 키를 자동 필터링하지 않습니다. 이것은 실제로 나를 위해 더 잘 작동합니다.
Keypress새 캐릭터가 추가되기 전에 이벤트가 시작되기 때문 입니다. 대신 'keyup'이벤트를 사용하면 상황에 완벽하게 작동합니다.
$(document).ready(function() {
$("#dSuggest").keyup(function() {
var dInput = $('input:text[name=dSuggest]').val();
console.log(dInput);
$(".dDimension:contains('" + dInput + "')").css("display","block");
});
});텍스트 상자가 많고 키 업 이벤트에서 동일한 작업을 수행 해야하는 경우 일반적인 CSS 클래스 (예 : commoncss)를 제공하고 이와 같은 키 업 이벤트를 적용하면됩니다.
$(document).ready(function() {
$(".commoncss").keyup(function() {
//your code
});
});각 텍스트 상자에 대해 ID별로 키업 이벤트를 적용 할 필요가 없으므로 코드가 크게 줄어 듭니다.
jQuery는 키를 누른 후 입력 값을 얻습니다.
https://www.tutsmake.com/jquery-keypress-event-detect-enter-key-pressed/
i = 0;
$(document).ready(function(){
$("input").keypress(function(){
$("span").text (i += 1);
});
}); <!DOCTYPE html>
<html>
<head>
<title>jQuery keyup() Method By Tutsmake Example</title>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
</head>
<body>
Enter something: <input type="text">
<p>Keypresses val count: <span>0</span></p>
</body>
</html>