在dojo中有可能区分程序化滚动和用户滚动吗



我在顶部有一个浮动条,当用户向上或向下滚动页面时,它会被显示/隐藏。当Dojo/浏览器以编程方式滚动页面时,例如当将焦点放在表单中的无效元素上时,我需要完全隐藏它

是否可以知道滚动是由于用户输入而发生的?

这在一般情况下无法完成,但可以在问题中提到的特定情况下完成,即检测滚动是因为Dojo试图将焦点放在表单中的无效元素上。要做到这一点,有必要覆盖dijit/form/Form中的validate方法,以便它可以自动覆盖表单中所有小部件的focus方法:

validate: function(){
var self = this;
var children = this._getDescendantFormWidgets();
array.forEach(children, function(child){
if(typeof(child.focus) === "function" && !child._uuiIsModded){
child._uuiOldFocus = child.focus;
child.focus = self._onProgrammaticFocus;
child._uuiIsModded = true;
}
});
return this.inherited(arguments);
},
_onProgrammaticFocus: function(){
topic.publish("on-programmatic-focus", this);
this._uuiOldFocus.apply(this, arguments);
},

新的validate方法修改了表单中包含的所有窗口小部件。该修改是将标准的focus方法替换为自定义方法_onProgrammaticFocus,该方法在调用标准focus方法之前触发事件on-programmatic-focus。这样,只有当焦点以编程方式放在小部件上以响应验证错误时,才会触发事件,而不是当用户选择小部件时:

  • 当用户用鼠标选择小部件或点击它来将焦点放在小部件上时,不会调用focus方法
  • 当表单小部件包含无效值时,validate方法的标准行为是用显示验证错误的CSS类修改小部件,并通过调用focus方法将焦点放在小部件上。在这种情况下,焦点应该已经被修改,并启动"聚焦程序"活动

请记住,这是一个替代标准focus方法的破解,如果代码的其他部分出现问题,则可能不起作用。具体来说,在某些情况下,如果包含其他小部件的小部件没有继承dijit/_Container,则__uuiOldFocus可能会变得未定义。这是因为this._getDescendantFormWidgets()返回的子级与dom/dom-form返回的方法toObject不同。表单验证中使用的方法this._getDescendantFormWidgets()依赖于这样一个事实,即包含其他小部件的所有小部件都应该继承dijit/_Containermixin(使用当前DOM节点初始化this.containerNode)。

最新更新