Safari 和 Firefox 输入元素不会在点击时获得焦点

Question

我不太清楚怎么问这个问题。

我写了网站http://math.qb.is，先是在jQuery和Handlebars里写的，然后在AngularJS里重写了，但最后的结果是一样的。只有第一个问题会获得焦点，尝试单击任何元素只会重新聚焦第一个项目。您可以使用 TAB 键四处移动，但这不是解决方案。这在 Chrome 中按预期工作。我还不能在 IE 上测试这个，但是最新的 Safari 和 FireFox 都失败了。

我知道让人们离开网站是不受欢迎的，但我无法描述这个问题，除非动态生成的输入字段无法获得焦点，或者类似的东西，这真的不完全是问题。

该站点只是 Javascript，除了提供索引文件外没有后端。

所有文件都没有最小化。非常感谢所有帮助。

Answer 1

不要将多个输入放在一个标签内。默认情况下，任何点击标签都会聚焦第一个输入。而是尝试用不同的标签包装输入。这将解决您的问题。它与 angular/handlebar 无关，它只是一个 html/css 问题。如果要换行，请尝试除标签之外的其他 html 元素。

这是一个简单的例子：

<label>Click me
    <input type="text" />
    <br/>
    <input type="text" />
</label>
<br/>
<br/>
<label>Click me
    <input type="text" />
</label>
<label>Click me
    <input type="text" />
</label>

演示：http://jsfiddle.net/lotusgodkk/KN9xx/322/

Safari 和 Firefox 输入元素不会在点击时获得焦点

Safari and Firefox input elements do not get focus on click

safari

firefox

jquery

google-chrome

angularjs