Question

使用SemanticUI模式。我希望触发一个显示模态的事件，然后在表单中的textarea上设置.focus（）和.select（）（它不是表单中的第一个控件）。

当我有这个时，似乎没有开火：

$('.ui.modal').modal('setting', {
      autofocus: false,
      onVisible: function() {
        $('.ui.modal textarea').focus();
        $('.ui.modal textarea').select();
      }
    }).modal('show');

Answer 1

显然，autofocus选项在设置任何其他焦点后触发，无论是html属性还是onVisible回调，并覆盖它。

由Cas Nouwens支持的{p> <textarea autofocus="true">只会将注意力集中在textarea元素上，但它不会让您选择其文本。如果这是所需的行为，您可以坚持使用此解决方案并完全删除modal('setting' ,{...})。

否则，我发现了一个（非常脏，我承认）解决方法，将代码包装在一个很小的超时中。转换几乎不可见。

$('.ui.modal').modal('setting', {
  autofocus: false,
  onVisible: function () {
    setTimeout(function () {
      $('.ui.modal textarea').focus();
      $('.ui.modal textarea').select();
    }, 10);
  }
}).modal('show');

这是working example

SemanticUI - 将重点放在Modal中的textarea上

1 个答案: