텍스트 상자가 포커스를 잃을 때까지 jQuery 텍스트 상자 변경 이벤트가 발생하지 않습니까?

텍스트 상자 외부에서 클릭 할 때까지 텍스트 상자의 jQuery 변경 이벤트가 시작되지 않는다는 것을 알았습니다.

HTML :

<input type="text" id="textbox" />

JS :

$("#textbox").change(function() {alert("Change detected!");});

JSFiddle 데모 보기

내 응용 프로그램은 텍스트 상자의 모든 문자 변경시 이벤트를 시작해야합니다. 대신 키업을 사용해 보았습니다 ...

$("#textbox").keyup(function() {alert("Keyup detected!");});

... 키업 이벤트가 마우스 오른쪽 버튼으로 클릭하여 붙여 넣기로 시작되지 않는다는 것은 알려진 사실입니다.

해결 방법이 있습니까? 두 청취자 모두에게 문제가 있습니까?

두 가지 이벤트에 바인딩하는 것이 일반적인 방법입니다. 붙여 넣기 이벤트에 바인딩 할 수도 있습니다.

다음과 같이 여러 이벤트에 바인딩 할 수 있습니다.

$("#textbox").on('change keyup paste', function() {
    console.log('I am pretty sure the text box changed');
});

당신이 그것에 대해 pedantic하고 싶다면, 당신은 또한 텍스트를 드래그하기 위해 마우스 업에 바인딩 lastValue하고 텍스트가 실제로 변경되었는지 확인 하는 변수를 추가 해야합니다 :

var lastValue = '';
$("#textbox").on('change keyup paste mouseup', function() {
    if ($(this).val() != lastValue) {
        lastValue = $(this).val();
        console.log('The text box really changed this time');
    }
});

그리고 super duperpedantic 하고 싶다면 자동 채우기, 플러그인 등을 제공하기 위해 간격 타이머를 사용해야합니다.

var lastValue = '';
setInterval(function() {
    if ($("#textbox").val() != lastValue) {
        lastValue = $("#textbox").val();
        console.log('I am definitely sure the text box realy realy changed this time');
    }
}, 500);

최신 브라우저에, 당신은 사용할 수 있습니다 이벤트를 :input

데모

$("#textbox").on('input',function() {alert("Change detected!");});

$(this).bind('input propertychange', function() {
        //your code here
    });

이것은 입력, 붙여 넣기, 마우스 오른쪽 클릭 등의 작업에 사용됩니다.

if you write anything in your textbox, the event gets fired.
code as follows :

HTML :

<input type="text" id="textbox" />

JS :

<script type="text/javascript">
  $(function () {
      $("#textbox").bind('input', function() {
      alert("letter entered");
      });
   });
</script>

이 시도:

$("#textbox").bind('paste',function() {alert("Change detected!");});

JSFiddle 데모를 참조하십시오 .

아래 코드를 사용해보십시오 :

$("#textbox").on('change keypress paste', function() {
  console.log("Handler for .keypress() called.");
});

당신의 의견을 읽으면 더러워졌습니다. 이것은 올바른 방법은 아니지만 해결 방법이 될 수 있습니다.

$(function() {
    $( "#inputFieldId" ).autocomplete({
        source: function( event, ui ) {
            alert("do your functions here");
            return false;
        }
    });
});