jquery-InputMast переопределяет существующие события в поле ввода

В коде ниже я прикрепил событие onChange() к идентификатору "phone_world", а также применил к нему маску ввода. Входная мачта работает нормально, но удаление существующего события и функции приветствия не вызывается.

<div class="demo">
<input type="text" id="phone_world" onChange = "hello()" value="" size="25">
<label for="phone_world" id="descr_world">Страны мира</label>

<script>
  var listCountries = $.masksSort($.masksLoad("https://cdn.rawgit.com/andr-04/inputmask-multi/master/data/phone-codes.json"), ['#'], /[0-9]|#/, "mask");

  var maskOpts = {
    inputmask: {
      definitions: {
    '#': {
      validator: "[0-9]",
      cardinality: 1
    }
  },
  showMaskOnHover: false,
  autoUnmask: true,
  clearMaskOnLostFocus: false
},
  match: /[0-9]/,
  replace: '#',
  listKey: "mask"
};
var maskChangeWorld = function(maskObj, determined) {
if (determined) {
    var hint = maskObj.name_ru;
    if (maskObj.desc_ru && maskObj.desc_ru != "") {
    hint += " (" + maskObj.desc_ru + ")";
  }
  $("#descr_world").html(hint);
 } else {
    $("#descr_world").html("Страны мира");
  }
}
  $('#phone_world').inputmasks($.extend(true, {}, maskOpts, {
     list: listCountries,
     onMaskChange: maskChangeWorld
 }));
  function hello(){
   alert('hi');
  }
 </script>

1 ответ

Решение

В соответствии с документами ввода jQuery для маски, keydown, keypress, paste, input, dragdrop, drop & blur события прерываются, однако кажется, что change событие также прерывается (и не документируется). Что вы можете сделать, это связать focus а также blur события, чтобы проверить изменения (с некоторой помощью data() функция сохранения изменений и сравнения их).

Вот пример кода:

$('#phone_world')
    .on('focus', function() {
        $(this).data('original-val', $(this).val())
    })
    .on('blur', function() {
        if ($(this).data('original-val') != $(this).val()) {    
            alert('value changed')
        } else {
            alert("value wasn't changed")
        }
    });

Вот рабочая скрипка: https://fiddle.jshell.net/5a6xo8kc/

Другие вопросы по тегам