AngularJS / JQuery - 没有关联标签的表单输入答案

【问题标题】：AngularJS / JQuery - form input without an associated labelAngularJS / JQuery - 没有关联标签的表单输入
【发布时间】：2015-06-14 12:21:34
【问题描述】：

我对“没有关联标签的表单输入”有疑问。这出现在 [textarea]、[select]、[select]、[input] 类上。

这是我的代码：

<div class="panel-body">
<form name="f" data-ng-submit="addTodo()">
  Nazwa:
  <textarea class="form-control" name="newTodo" data-ng-model="formData.newTodo" required></textarea>
  Typ:
  <select class="form-control" name="type" data-ng-model="formData.type" data-ng-option="value.name for value in categories" required></select>
  Estymowany czas:
  <select class="form-control" name="estimates" data-ng-model="formData.estimates" data-ng-option="value + 'h' for value in [] | rangeTime:9:true" required></select>
  Data:
  <input class="form-control" type="text" data-ng-model="formData.date" data-ng-data-picker="" name="date" required readonly="readonly">
  <br />
  <button class="btn btn-success" data-ng-disabled="f.$invalid">Add <span class="glyphicon glyphicon-ok"></span></button>
</form>

感谢您的帮助！

版主澄清： 上面引用的消息是 JetBrains 产品在 IDE 中提供的警告。 OP最有可能使用用于前端开发的 WebStorm 或 IntelliJ。

【问题讨论】：

你在说什么？您在何时何地看到该消息？
当我将光标放在上面时出现消息：<select class><input class></select>
您的意思是在您的 IDE 中？如果是什么IDE？请提供完整和正确的细节，不要让我们一点一点地从你身上榨取信息。
dfsq 回答了这个问题。问题消失了。

标签： javascript jquery angularjs intellij-idea webstorm

【解决方案1】：

这不是错误，但是为了方便用户体验，建议将标签与相应的表单元素相关联。例如对于名称字段：

<label for="name">Nazwa:</label>
<textarea class="form-control" id="name" name="newTodo" data-ng-model="formData.newTodo" required></textarea>

我假设您的 IDE 足够聪明，可以识别缺失的标签并为您提供添加这些标签的合理建议。

【讨论】：

【解决方案2】：

我猜WebStorm？

只需按照建议添加标签即可。 label 对radio、checkbox 尤其有用，因此您只需单击标签即可激活它们。

【讨论】：