文本框在滚动时失去焦点在模态中

时间:2015-01-30 14:06:01

标签: javascript html twitter-bootstrap

我正在使用AngularJS和UI Bootstrap在模式对话框中显示表单。但是,单击滚动条时,任何输入都会失去焦点。

如果滚动条与div或窗口相关联,则会发生这种情况。

如果文本输入不在模态内,则在滚动期间保持焦点。

可以在http://plnkr.co/edit/uaXiT1NedWjUm2DOKyrD?p=preview

找到一个示例

输入没有什么特别之处,它可以像

一样简单
<input type="text" id="textinput" name="textinput"/>

用户滚动时有没有办法保持焦点?

由于

克里斯

2 个答案:

答案 0 :(得分:1)

滚动时不会失去焦点,单击滚动条时会失去焦点。例如,如果您有鼠标滚轮,则可以滚动模态内容而不会失去焦点。

基本上单击滚动条与单击模态中不在输入字段中的任何其他位置相同。

确实有些滚动条不会这样做(至少在Chrome中)。我不知道有什么区别。我已经确认它发生在任何设置为溢出的东西上:至少是自动或滚动。它与AngularJS无关。

单击“联系我们”按钮,看到它发生在纯Bootstrap中:http://www.bootply.com/8R8QWNO6Qv

我不认为会有一个简单的解决方案可以防止这种情况发生,而这种解决方案不涉及跟踪重点是什么等等;在多输入表格上这将非常复杂。

答案 1 :(得分:-1)

添加&nbsp;-blur-addFocus($ event)&#39;在你的模板中 然后将此功能添加到控制器

$scope.addFocus = function(e){
e.target.focus();

}

它会起作用: - )