Question

我过去曾使用HTML5标签'for'属性，它可以很好地用于点击它，它会将焦点更改为相关的表单项。但是，在这种情况下，每个项目的名称部分由其索引确定，标签似乎不响应点击。

HTML

<div data-bind='foreach: people'>
    <div class="personWell">  
        <label data-bind="attr: {'for':'personsObserved['+ $index()+'][name]'}" class="content-label">Name</label> 
        <input type="text" data-bind="attr: {'name':'personsObserved['+ $index()+'][name]'}, value: name" required placeholder="Person Name"></input>

        <label data-bind="attr: {'for':'personsObserved['+ $index()+'][company]'}" class="content-label">Company</label>
        <input type="text" data-bind="attr: {'name':'personsObserved['+ $index()+'][company]'}, value: company" required placeholder="Company Name"></input>

        <button type="button" class="btn btn-xs btn-warning" data-bind='visible: $root.people().length > 1, click: $root.removePerson'>Delete</button>
    </div> 
</div>

输出来源

<label data-bind="attr: {'for':'personsObserved['+ $index()+'][name]'}" class="content-label" for="personsObserved[0][name]">Name</label>

<input type="text" data-bind="attr: {'name':'personsObserved['+ $index()+'][name]'}, value: name" required="" placeholder="Person Name" name="personsObserved[0][name]">

如您所见，'for'和'name'属性匹配。但是点击标签什么都不做。

Answer 1

for属性必须在HTML 5中指定ID ...它不会与name属性一起使用。

http://www.w3schools.com/tags/tag_label.asp

Knockout.JS标签不在foreach内部工作

1 个答案: