jQuery는 키를 누른 후 입력 값을 얻습니다.
다음과 같은 기능이 있습니다.
$(document).ready(function() {
$("#dSuggest").keypress(function() {
var dInput = $('input:text[name=dSuggest]').val();
console.log(dInput);
$(".dDimension:contains('" + dInput + "')").css("display","block");
});
});
어떤 이유로 든 첫 번째 키 누르기 때문에 콘솔 로그에 빈 문자열이 나타납니다.
이는 새 문자가 요소에 추가 되기 전에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"대신 이벤트를 사용 하고 .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)는 키 누르기 이벤트를 트리거하지만 키 누르기 이벤트는 트리거하지 않습니다.
입력을 업데이트하려면 실행 스레드를 중단해야합니다.
$(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);
});
});
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
});
});
this will greatly reduce you code as you don't have to apply keyup event by id for each textboxes.
I was looking for a ES6 example (so it could pass my linter) So for other people who are looking for the same:
$('#dSuggest').keyup((e) => {
console.log(e.currentTarget.value);
});
I would also use keyup because you get the current value that is filled in.
I think what you need is the below prototype
$(element).on('input',function(){code})
jQuery get input value after keypress
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> Just use a timeout to make your call; the timeout will be called when the event stack is finished (i.e. after the default event is called)
$("body").on('keydown', 'input[type=tel]', function (e) {
setTimeout(() => {
formatPhone(e)
}, 0)
});
참고URL : https://stackoverflow.com/questions/8795283/jquery-get-input-value-after-keypress
'IT박스' 카테고리의 다른 글
| AngularJS로 배열을 필터링하고 필터링 된 객체의 속성을 ng-model 속성으로 사용하려면 어떻게합니까? (0) | 2020.07.16 |
|---|---|
| Android에서 EditText의 최대 문자 수를 어떻게 설정합니까? (0) | 2020.07.16 |
| 안드로이드의 RecyclerView에 간단한 8dp 헤더 / 바닥 글을 추가하는 방법은 무엇입니까? (0) | 2020.07.16 |
| 해시 값을 변경하는 방법? (0) | 2020.07.16 |
| 스위치 문에 "또는"을 어떻게 추가합니까? (0) | 2020.07.16 |