programing

val()은 jQuery에서 변경()을 트리거하지 않습니다.

javamemo 2023. 5. 10. 20:10
반응형

val()은 jQuery에서 변경()을 트리거하지 않습니다.

저는 그들을 자극하려고 노력하고 있습니다.change버튼으로 값을 변경하면 텍스트 상자에서 이벤트가 발생하지만 작동하지 않습니다. 바이올린을 확인하세요.

텍스트 상자에 무언가를 입력하고 다른 곳을 클릭하면,change트리거됩니다.그러나 버튼을 클릭하면 텍스트 상자 값이 변경되지만,change방아쇠를 당기지 않아요. 왜죠?

onchange사용자가 입력을 입력한 다음 입력의 초점을 잃을 때만 실행됩니다.

수동으로 호출할 수 있습니다.onchange값을 설정한 후 이벤트 사용:

$("#mytext").val( 777 ).change(); // someObject.onchange(); in standard JS

또는 다음을 사용하여 이벤트를 트리거할 수 있습니다.

$("#mytext").val( 777 ).trigger("change");

빨간색 사각형의 훌륭한 제안에 따르면, 이것은 잘 작동합니다.

$.fn.changeVal = function (v) {
    return this.val(v).trigger("change");
}

$("#my-input").changeVal("Tyrannosaurus Rex");

매우 쉽게 오버라이드할 수 있습니다.val원본에 대한 프록시로 대체하여 변경을 트리거하는 기능val기능.

문서의 어딘가에 이 코드를 추가합니다(jQuery 로드 후).

(function($){
    var originalVal = $.fn.val;
    $.fn.val = function(){
        var result =originalVal.apply(this,arguments);
        if(arguments.length>0)
            $(this).change(); // OR with custom event $(this).trigger('value-changed');
        return result;
    };
})(jQuery);

작동 예: 여기

(항상 트리거됩니다.change언제val(new_val)값이 실제로 변경되지 않은 경우에도 호출됩니다.)

값이 실제로 변경되었을 때만 변경을 트리거하려면 다음을 사용합니다.

//This will trigger "change" event when "val(new_val)" called 
//with value different than the current one
(function($){
    var originalVal = $.fn.val;
    $.fn.val = function(){
        var prev;
        if(arguments.length>0){
            prev = originalVal.apply(this,[]);
        }
        var result =originalVal.apply(this,arguments);
        if(arguments.length>0 && prev!=originalVal.apply(this,[]))
            $(this).change();  // OR with custom event $(this).trigger('value-changed')
        return result;
    };
})(jQuery);

실시간 예제: http://jsfiddle.net/5fSmx/1/

메소드를 다음과 같이 연결해야 합니다.

$('#input').val('test').change();

아니요. 값을 설정한 후 수동으로 트리거해야 할 수 있습니다.

$('#mytext').change();

또는:

$('#mytext').trigger('change');

행사가 활기를 띠지 않는 것처럼 보입니다.사용해 보십시오.

$("#mybutton").click(function(){
  var oldval=$("#mytext").val();
  $("#mytext").val('Changed by button');
  var newval=$("#mytext").val();
  if (newval != oldval) {
    $("#mytext").trigger('change');
  }
});

이것이 도움이 되길 바랍니다.

나는 그냥 오래된 것을 시도했습니다.$("#mytext").trigger('change')오래된 가치를 저장하지 않고, 그리고..change값이 변경되지 않은 경우에도 발생합니다.그래서 이전 값을 저장하고 전화했습니다.$("#mytext").trigger('change')변경될 경우에만.

2019년 2월 기준.addEventListener()현재 jQuery에서 작동하지 않습니다..trigger()또는.change()아래에서 Chrome 또는 Firefox를 사용하여 테스트할 수 있습니다.

txt.addEventListener('input', function() {
  console.log('not called?');
})
$('#txt').val('test').trigger('input');
$('#txt').trigger('input');
$('#txt').change();
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" id="txt">

대신 사용해야 합니다.

txt.addEventListener('input', function() {
  console.log('it works!');
})
$('#txt').val('yes')
txt.dispatchEvent(new Event('input'));
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input type="text" id="txt">

이것이 오래된 스레드라는 것을 알지만, 다른 사람들이 보기에 위의 솔루션은 확인하는 대신 다음과 같이 좋지 않을 수 있습니다.change이벤트, 확인input사건들

$("#myInput").on("input", function() {
    // Print entered value in a div box
    $("#result").text($(this).val());
});

https://api.jquery.com/change/ 에서:

change이벤트는 값이 변경될 때 요소로 전송됩니다.이 이벤트는 다음으로 제한됩니다.<input>요소들,<textarea>박스와<select>요소들.선택 상자, 확인란 및 라디오 버튼의 경우 사용자가 마우스를 사용하여 선택하면 이벤트가 즉시 실행되지만, 다른 요소 유형의 경우 요소의 포커스가 떨어질 때까지 이벤트가 지연됩니다.

특성 및 밸브 방법을 사용한 다음 변경을 트리거할 수 있습니다.

$('.parent-form').find('input').each(function() {
    item = $(this);
    item.attr('value', '0622-03-22');
    item.val('01/01/01').trigger('change');
});

언급URL : https://stackoverflow.com/questions/3179385/val-doesnt-trigger-change-in-jquery

반응형