表单元素和相关标签

Question

如何在下面的代码中为表单元素创建关联标签？

render() {
return (
  <section className="col">
    <div className="input-group">
      <input type="text" 
      id="search-input" 
      ref="searchInput" 
      className="form-control" 
      placeholder="Filter location..." 
      onChange={this.handleChange} />
      <span className="input-group-addon">Filter</span>
    </div>
  </section>
)
}

Answer 1

在下面使用。

<section className="col">
    <div className="input-group">
      <label for="search-input">Filter</label>
      <input type="text" 
      id="search-input" 
      ref="searchInput" 
      className="form-control" 
      placeholder="Filter location..." 
      onChange={this.handleChange} />
    </div>
  </section>

创建标签并将输入元素 id 赋予标签的属性

表单元素和相关标签

Form elements and associated labels

html

javascript

labeling