未在指定事件上触发事件处理程序
Event handler not triggered on specified event
我正在实现一个具有复杂数据字段依赖性的用户输入表单。例如,收集用户地址的表单:国家、州和街道地址。
当country字段发生变化时,我想触发state字段的清理过程。当状态改变时,我想要干净的街道地址字段。它们像依赖树结构一样链接在一起。
这是我在 JSFiddle 中的设置。它包含 5 个输入框。他们的依赖树是用 HTML5 数据属性实现的。
我想为每个输入框的 change
事件绑定一个函数 cleanSubtree
。因此,无论何时检测到更改,此函数都会清除所有相关字段。如下:
$('input').on('change',function cleanSubtreeHandlerWrapper(e){
var inputElem = $(this);
return function(){
e.stopPropagation();
cleanSubtree(inputElem);
};
});
但是,当我更改任何输入框的文本时,有界函数似乎没有执行。
但是如果我直接调用它们,该函数将正常工作,例如cleanSubtree($('#i3'));
。
请问cleanSubtree
函数没有触发的原因是什么?
(PS: 我正在使用 jQuery 2.1.4 和 Chrome 51.0.2704.103 m)
编辑:解决方法是更改包装函数。之前的版本没有调用包装函数。
$('input').on('change',
function cleanSubtreeHandlerWrapper(e){ //** seems not triggered
e.stopPropagation();
cleanSubtree($(this));
});
更改:
$('input').on('change',function processNodeHandlerWrapper(e){
var inputElem = $(this);
return function(){
e.stopPropagation();
cleanSubtree(inputElem);
};
});
至:
<script>
$('input').on('change',function processNodeHandlerWrapper(e){
var inputElem = $(this);
e.stopPropagation();
cleanSubtree(inputElem);
})
</script>
我正在实现一个具有复杂数据字段依赖性的用户输入表单。例如,收集用户地址的表单:国家、州和街道地址。
当country字段发生变化时,我想触发state字段的清理过程。当状态改变时,我想要干净的街道地址字段。它们像依赖树结构一样链接在一起。
这是我在 JSFiddle 中的设置。它包含 5 个输入框。他们的依赖树是用 HTML5 数据属性实现的。
我想为每个输入框的 change
事件绑定一个函数 cleanSubtree
。因此,无论何时检测到更改,此函数都会清除所有相关字段。如下:
$('input').on('change',function cleanSubtreeHandlerWrapper(e){
var inputElem = $(this);
return function(){
e.stopPropagation();
cleanSubtree(inputElem);
};
});
但是,当我更改任何输入框的文本时,有界函数似乎没有执行。
但是如果我直接调用它们,该函数将正常工作,例如cleanSubtree($('#i3'));
。
请问cleanSubtree
函数没有触发的原因是什么?
(PS: 我正在使用 jQuery 2.1.4 和 Chrome 51.0.2704.103 m) 编辑:解决方法是更改包装函数。之前的版本没有调用包装函数。
$('input').on('change',
function cleanSubtreeHandlerWrapper(e){ //** seems not triggered
e.stopPropagation();
cleanSubtree($(this));
});
更改:
$('input').on('change',function processNodeHandlerWrapper(e){
var inputElem = $(this);
return function(){
e.stopPropagation();
cleanSubtree(inputElem);
};
});
至:
<script>
$('input').on('change',function processNodeHandlerWrapper(e){
var inputElem = $(this);
e.stopPropagation();
cleanSubtree(inputElem);
})
</script>