Clickable dojo标签

Question

如果您使用的是dojo表单输入，并希望像这样为它们添加标签：

<label for="???">Email</label>
<input
  type="text"
  name="email"
  dojoAttachPoint="email"
  dojoType="dijit.form.TextBox"
/>

标签不可单击，因为在呈现输入之前无法知道输入的ID。

除了破解该元素的dojo生成的ID之外，是否存在其他解决方案？

UPDATE

实际上比我想象的还要困难，因为dojo中的输入字段被渲染为

<div class="dijit dijitTextBox" id="widget_dijit_form_TextBox_0">
  <input class="dijitReset dijitInputField" value="Χ" type="text" tabindex="-1">
  ...
</div>

并且基础输入字段没有ID

Answer 1

您是否尝试给输入提供ID？

<label for="myIdComesHere">Email</label>
<input
  id="myIdComesHere"
  type="text"
  name="email"
  dojoAttachPoint="email"
  dojoType="dijit.form.TextBox"
/>

---

如果我没记错的话，dojo.byId（可以获取domNode aka输入标签）和dijit.byId（可以获取dijit Widget实例）都可以使用此id。

Answer 2

如果要在小部件内部创建表单，则可以使用this.id获取该小部件实例的ID。

如果您的窗口小部件名为my.form，则窗口小部件的ID将为my_form_0，并且对于创建的每个新表单窗口小部件将递增。

要为表单元素创建唯一的ID，请使用

var id = this.id + '_email';

'<label for="' + id + '"/>'
'<input type="text" id="' + id + '"/>'

那会给你

<label for="my_form_0_email"/>
<input type="text" id="my_form_0_email"/>

如果您使用dijit.form.TextBox创建输入，则该文本框将始终在页面上具有唯一的ID。小部件内的实际<input> dom元素将具有通过获取小部件的ID而找到的ID。

如果您以编程方式创建TextBox，则可以执行以下操作：

var tb = new dijit.form.TextBox(),
    label = dojo.create("label", {for: tb.id});

Answer 3

如果您不关心与IE的兼容性，则可以将输入内容放置在标签内：

<label><input type=checkbox>hello</label>

Answer 4

正如布赖恩·马修斯（Brian Mathews）所说，诀窍是使用小部件的ID，但不必在javascript中进行操作，您可以在声明小部件模板时进行操作

<label for="${id}_email"/>
<input type="text" id="${id}_email"/>