변경시 어떻게 구현합니까

변경시 어떻게 구현합니까 jQuery와 함께?

---

<select>이 API가 있습니다. 무엇에 대해 <input>?

---

당신이 사용할 수있는 .change()

$('input[name=myInput]').change(function() { ... });

그러나이 이벤트는 선택기가 포커스를 잃은 경우에만 발생하므로이 작업을 수행하려면 다른 곳을 클릭해야합니다.

그것이 당신에게 적합하지 않은 경우 원하는 효과에 따라 keyup , keydown 또는 keypress 와 같은 다른 jQuery 이벤트를 사용할 수 있습니다 .

---

@pimvdb가 그의 의견에서 말했듯이,

입력 요소가 포커스를 잃은 경우에만 변경 사항이 적용됩니다. 포커스를 잃지 않고 텍스트 상자가 업데이트 될 때마다 발생하는 입력 이벤트도 있습니다. 주요 이벤트와 달리 텍스트 붙여 넣기 / 끌기에도 작동합니다.

( 문서 참조 )

이것은 매우 유용하므로 답을 넣을 가치가 있습니다. 현재 (v1.8 *?) jquery에는 .input () 편리함 fn이 없으므로 수행 방법은 다음과 같습니다.

$('input.myTextInput').on('input',function(e){
 alert('Changed!')
});

---

다음과 같이 키업 이벤트를 사용하는 것이 좋습니다.

$('elementName').keyup(function() {
 alert("Key up detected");
});

동일한 결과를 얻는 몇 가지 방법이 있으므로 선호도에 달려 있고 정확하게 작동하는 방법에 달려 있습니다.

업데이트 : 복사 및 붙여 넣기가 아닌 수동 입력에만 작동합니다.

복사하여 붙여 넣으려면 다음을 권장합니다.

$('elementName').on('input',function(e){
 // Code here
});

---

내가 사용하는 코드는 다음과 같습니다.

$("#tbSearch").on('change keyup paste', function () {
    ApplyFilter();
});

function ApplyFilter() {
    var searchString = $("#tbSearch").val();
    //  ... etc...
}

<input type="text" id="tbSearch" name="tbSearch" />

이것은 특히 jqGrid컨트롤 과 쌍을 이룰 때 아주 잘 작동합니다 . 텍스트 상자에 입력하고 의 결과를 즉시 볼 수 있습니다 jqGrid.

---

이 작업을 수행하는 신뢰할 수있는 방법은 단 하나 뿐이며 간격에서 값을 가져 와서 캐시 된 값과 비교하는 것입니다.

이것이 유일한 방법 인 이유는 다양한 입력 (키보드, 마우스, 붙여 넣기, 브라우저 기록, 음성 입력 등)을 사용하여 입력 필드를 변경하는 여러 가지 방법이 있고 표준 이벤트를 사용하여 모든 입력을 교차로 감지 할 수 없기 때문입니다 브라우저 환경.

다행히 jQuery의 이벤트 인프라 덕분에 자체 입력 변경 이벤트를 쉽게 추가 할 수 있습니다. 나는 여기에서 그렇게했다 :

$.event.special.inputchange = {
    setup: function() {
        var self = this, val;
        $.data(this, 'timer', window.setInterval(function() {
            val = self.value;
            if ( $.data( self, 'cache') != val ) {
                $.data( self, 'cache', val );
                $( self ).trigger( 'inputchange' );
            }
        }, 20));
    },
    teardown: function() {
        window.clearInterval( $.data(this, 'timer') );
    },
    add: function() {
        $.data(this, 'cache', this.value);
    }
};

다음과 같이 사용하십시오. $('input').on('inputchange', function() { console.log(this.value) });

여기 데모가 있습니다 : http://jsfiddle.net/LGAWY/

여러 간격을 무서워하는 경우 바인딩 해제 /에이 이벤트에 바인딩 할 수 있습니다 focus/을 blur.

---

<input id="item123" class="firstName" type="text" value="Hello there" data-someattr="CoolExample" />

$(".firstName").on('change keyup paste', function () {
   var element = $(this);
   console.log(element);
   var dataAttribute = $(element).attr("data-someattr");
   console.log("someattr: " + dataAttribute );
});

this전체 요소에 액세스하려면이 요소를 사용하여 필요한 모든 것을 수행 할 수 있도록 키워드를 사용하는 것이 좋습니다 .

---

$("input").keyup(function () {
    alert("Changed!");
});

---

다음은 동적 / Ajax 호출 인 경우에도 작동합니다.

스크립트:

jQuery('body').on('keyup','input.addressCls',function(){
  console.log('working');
});

HTML,

<input class="addressCls" type="text" name="address" value="" required/>

I hope this working code will help someone who is trying to access dynamically/Ajax calls...

---

You could simply work with the id

$("#your_id").on("change",function() {
    alert(this.value);
});

---

$("input").change(function () {
    alert("Changed!");
});

---

This worked for me. If field with name fieldA is clicked or any key entered it updates field with id fieldB.

jQuery("input[name='fieldA']").on("input", function() {
    jQuery('#fieldB').val(jQuery(this).val());
});

---

You could use .keypress().

For example, consider the HTML:

<form>
  <fieldset>
    <input id="target" type="text" value="Hello there" />
  </fieldset>
</form>
<div id="other">
  Trigger the handler
</div>

The event handler can be bound to the input field:

$("#target").keypress(function() {
  alert("Handler for .keypress() called.");
});

I totally agree with Andy; all depends on how you want it to work.

---

You can do this in different ways, keyup is one of them. But i am giving example below with on change.

$('input[name="vat_id"]').on('change', function() {
    if($(this).val().length == 0) {
        alert('Input field is empty');
    }
});

NB: input[name="vat_id"] replace with your input ID or name.

참고URL : https://stackoverflow.com/questions/1443292/how-do-i-implement-onchange-of-input-type-text-with-jquery