基本问题
input
事件—调用-->update()
—调用-->geoInput.receive()
—触发-->input
事件
解释
好吧,我遇到了一个奇怪的问题,它导致我的代码无限循环。我有下面的jQuery:
var geoInput = $('#Geo').on('input', function() {
_this._controller.update({
geo: this.value
});
}).get(0);
正如您所看到的,它只是一个基本的事件监听器,它正在调用我的控制器中的更新函数。在更新功能的末尾是一种方法,该方法广播geoInput
字段以进行更新。这由以下人员处理:
geoInput.receive = function(formState) {
this.value = formState.geo;
this.placeholder = _this._placeholders.geo;
}
出于某种原因
this.placeholder = _this._placeholders.geo;
正在触发该字段上的CCD_ 6事件。您可以看到这是如何产生问题的,因为这会创建一个无限循环。我确信这就是发生的事情,因为当我在那行之前return
时,循环不会发生。此外,如果我改为keyup
事件,循环也不会发生。
问题
为什么会发生这种情况,我该如何解决?
我试过了
我已经看了几个小时了,做了很多搜索都没有结果。此代码在Chrome和FF中正常工作。
有趣的是,如果您只是将一个项目添加到INPUT属性占位符或拉丁字母以外的值,就会发生INPUT事件。这是IE10和IE11 的问题
var $input = $('<input type="text" placeholder="Бубу"/>');
//or
var $input = $('<input type="text" value="世界へようこそ"/>');
$input.on('input',function(){
alert('input even occur');
});
在没有看到你的小提琴的情况下,我认为你可以用以下代码来解决这个问题:
var previousGeoInput = '';
var geoInput = $('#Geo').on('input', function() {
if (previousGeoInput === this.value) {
return;
}
previousGeoInput = this.value;
_this._controller.update({
geo: this.value
});
}).get(0);
检查事件keycode/charcode,如果它为0,则表明IE愚蠢,您可以取消该事件。