val() не вызывает изменение() в jQuery

Question

Я пытаюсь вызвать событие change в текстовом поле, когда я меняю его значение кнопкой, но он не работает. Проверьте this fiddle.

Если вы введете что-то в текстовых полях и щелкните в другом месте, то запускается change. Однако, если вы нажмете кнопку, значение текстового поля будет изменено, но change не активируется. Зачем?

Answer 1

onchange только срабатывает, когда пользователь вводит на вход, а затем вход теряет фокус.

Вы можете вручную вызвать onchange событие, используя после установки значения:

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

В качестве альтернативы, вы можете trigger событие с помощью:

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

Answer 2

Нет вы, возможно, потребуется запустить его вручную после установки значение:

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

или:

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

Answer 3

Похоже, что события не пузырятся. Попробуйте следующее:

$("#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'), только если он изменился.

Answer 4

С отличным предложением RedSquare, это прекрасно работает:

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

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

Answer 5

Вы можете очень легко переопределить функцию 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); 

Рабочий пример: here

(Обратите внимание, что это всегда будет вызывать change когда val(new_val) называется, даже если значение Didn Фактически это изменилось.)

Если вы хотите активировать изменение ТОЛЬКО при фактическом изменении значения, используйте его:

//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/

Answer 6

От https://api.jquery.com/change/:

change событие посылается к элементу, когда его значение изменяется.Это событие ограничено <input> элементами, <textarea> боксами и <select> элементами. Для флажков выбора, флажков и переключателей событие немедленно запускается, когда пользователь делает выбор с помощью мыши, но для других типов элементов событие откладывается до тех пор, пока элемент не теряет фокус.

Answer 7

Вы должны приковать метод, как это: [? JQuery textbox.val ('хххх') не вызывает изменений в огонь]

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