jquery-InputMast 覆盖输入字段上的现有事件答案

【问题标题】：jquery-InputMast overriding existing events on input fieldjquery-InputMast 覆盖输入字段上的现有事件
【发布时间】：2016-09-04 09:16:45
【问题描述】：

在下面的代码中，我在 id "phone_world" 上附加了 onChange() 事件，并在其上应用了输入掩码。输入桅杆工作正常，但没有调用现有事件和 hello 函数。

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

【问题讨论】：

你能否添加一个相同的工作 sn-p，具有所有 js 依赖项。可能您需要添加一些输入掩码的回调函数，例如onKeyDown 或onKeyValidation。检查documentation here。
fiddle.jshell.net/kp183q11/light 检查这个小提琴链接。这里我们只需要在 id="phone_world" 和 Hello 函数上添加 onClick = "Hello" 即可。
@aManHasNoName 我们可以在 inputMask 选项中一次添加两个函数吗？我正在尝试添加 onKeyValidation() 但它只执行 onMaskChange()

标签： javascript jquery reactjs jquery-inputmask input-mask

【解决方案1】：

根据 jQuery 输入掩码 multi 的 docs，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/

【讨论】：

@Kalashir，不客气 :) 也将不胜感激。谢谢！