为啥切换到 DojoX 网格会导致 JavaScript“无法将焦点移至控制”错误?
Posted
技术标签:
【中文标题】为啥切换到 DojoX 网格会导致 JavaScript“无法将焦点移至控制”错误?【英文标题】:Why does tabbing to a DojoX grid result in a JavaScript "Can't move focus to control" error?为什么切换到 DojoX 网格会导致 JavaScript“无法将焦点移至控制”错误? 【发布时间】:2008-11-26 15:55:56 【问题描述】:问题 我在一个页面上有许多 Dojo 组件。当用户尝试从类似输入的组件切换到类似网格的组件时,我收到 javascript“无法将焦点移动到控件”错误。用户群使用 IE6。
解决方案 DojoX Grid 布局中的第一个元素不能隐藏。如果它被隐藏,您会收到一个 JavaScript“无法将焦点移动到控件”错误。为了解决这个问题,我添加了一个显示的行#。见下文。
var gridLayout = [ new dojox.grid.cells.RowIndex( name: "row #", width: 2, styles: "text-align: right;" ), field: "ele_id", name: "Element ID", styles: "text-align:right;", width:5, hidden:"true" , field: "ele_nm", name: "Element Name", styles: "text-align:left;", width:8 ];
【问题讨论】:
你为什么要那个???如果用户想要导航到某个输入字段,他应该能够,不是吗?您想阻止任何导航到该字段还是仅基于选项卡? Z 不是输入字段。我在一个页面上有许多 Dojo 组件。当用户尝试从类似输入的组件切换到类似网格的组件时,我收到 JavaScript“无法将焦点移动到控件”错误。 【参考方案1】:防止标签可能会干扰使用屏幕阅读器浏览您网站的视力不佳的用户。
【讨论】:
我澄清了上面的问题。感谢您指出了这一点。你还有什么其他方法可以处理这样的事情?【参考方案2】:如果输入 Y 不接受用户输入,则不要将其设为输入字段!
如果您只是将其用于值显示,请改用样式 <span>
或 <div>
。
【讨论】:
同意。设计良好的应用没有理由要求禁用 Tab 键。这就像在问“我可以禁用后退按钮吗?”你只是不这样做。这是预期标准的一部分。 我举了一个不好的例子。问题是从输入字段切换到无法处理的网格组件。我正在尝试防止发生 JavaScript 错误。【参考方案3】:我个人认为这种行为有点烦人。为什么要禁止用户专注于该领域?
更好的解决方案是隐藏/禁用该字段,直到准备好将数据输入其中。您还应该有一些文字来解释为什么该字段被禁用。
编辑:您发布的错误消息在谷歌上有一些结果,但似乎它可能是任意数量的问题,这个http://www.francoisfaubert.com/2008/03/06/cant-move-focus-to-control/ 听起来可能是一种可能性。检查您的 html 以查看页面上是否有其他具有相同 ID 的控件。
【讨论】:
澄清了上述问题。这是为了防止有人从输入字段切换到网格组件。你还建议用什么其他方法来处理它? 这个“网格组件”是什么? 我使用的 Grid 是一个 DojoX 组件。 不是 ID 问题。是的,谷歌搜索无效,所以我想我会在这里试一试。【参考方案4】:您可以将 Input-Z 设置为禁用控件。然后,当用户进入 Input-Y 并填写它时,将 Input-Z 更改为启用。你是怎么做到的:
<input id="Input-x" type="text" />
<input id="Input-y" type="text" onChange="document.getElementById('Input_Z').removeAttribute('disabled');" />
<input id="Input-z" type="text" disabled />
【讨论】:
【参考方案5】:您必须处理 keydown 事件并监听字符 9(这是制表符)。要使事件无效,您只需在用户按下字符 9 时返回 false。
function handleKeyDown(e)
var keynum;
var keychar;
var numcheck;
if(window.event) // IE
keynum = e.keyCode;
else if(e.which) // Netscape/Firefox/Opera
keynum = e.which;
return keynum != 9;
``
【讨论】:
您也必须处理相反方向的 shift-tab。【参考方案6】:在您的 cmets 澄清问题后,我了解您需要用户不能使用 tab 键聚焦元素。尝试添加到元素:
tabindex="-1"
举例:
<div id="mygrid" tabindex="-1"> <!-- Some stuff here --> </div>
关于负标签索引的更多信息:introduction-to-wai-aria
编辑: 更多关于 ARIA 的信息:http://www.w3.org/WAI/intro/aria
【讨论】:
【参考方案7】:关于错误信息:来自Fake's tank:
“很可能你的文档中有冲突的 id。另外,请记住 IE 7 和以前的版本认为 name 属性应该像 id 一样对待。”
首先,这是一个特定于 IE 的错误。其次,去改变你的身份证。它似乎是之前困扰一些惠普基于 html 的软件的问题,并且在用户从 IE6 升级到 IE7 时出现。
关于禁用焦点的问题 - 只需在标签中使用 type=hidden 隐藏任何不需要的输入,它们将不再是问题。永远不要乱用人们的标签 - 这是用 html 比 Windows 应用程序改进的一件事。
故事的寓意:
正确操作 微软在 Web 方面一败涂地 不要乱用标准的 GUI 行为【讨论】:
【参考方案8】:<input name="z" onfocus="this.blur()"/>
【讨论】:
我认为这对用户来说可能很烦人:他会尝试再次聚焦元素,但焦点总是转到另一个元素...... 我同意。我只是想回答这个问题。【参考方案9】:给组件元素一个tabindex属性,值为-1
【讨论】:
【参考方案10】:解决方案 DojoX Grid 布局中的第一个元素不能隐藏。如果它被隐藏,您会收到一个 JavaScript“无法将焦点移动到控制”错误。为了解决这个问题,我添加了一行 # 来显示。见下文。
var gridLayout = [ new dojox.grid.cells.RowIndex( name: "row #", width: 2, styles: "text-align: right;" ), field: "ele_id", name: "Element ID", styles: "text-align:right;", width:5, hidden:"true" , field: "ele_nm", name: "Element Name", styles: "text-align:left;", width:8 ];
【讨论】:
以上是关于为啥切换到 DojoX 网格会导致 JavaScript“无法将焦点移至控制”错误?的主要内容,如果未能解决你的问题,请参考以下文章
dojox.grid.EnhancedGrid 如何设置 noDataMessage?
将 dojox.datagrid 注入 dijit.layout.contentpane 到 dijit.layout.tabcontainer 时出现问题