Question

我在Windows 7上的Firefox 11中运行此代码。（请参阅http://jsfiddle.net/QStkd/）。

$('<div><input type="text" value="val" /></div>').dialog();

输入中的值未被选中，这在Chrome和IE中是这样做的，如果我手动调用select()方法，它也不起作用。

这是一个已知问题吗？有没有办法选择它？ Timers work但如果我在加载后点击jsfiddle上的run则不再有效。

Answer 1

看起来在Chrome上调用focus()（jquery-ui默认为第一个tabbable元素）（无法测试IE - 在OS X上）聚焦框并选择框内的文本

取自jquery.dialog.ui.js：

// set focus to the first tabbable element in the content area or the first button
// if there are no tabbable elements, set focus on the dialog itself
$(self.element.find(':tabbable').get().concat(
    uiDialog.find('.ui-dialog-buttonpane :tabbable').get().concat(
        uiDialog.get()))).eq(0).focus();

另一方面，Firefox在调用焦点时似乎只将光标放在框中。因此，您必须在创建对话框后隐式调用select，以实现您的目标。

如果你重新加载你的计时器（而不是点击运行），你会注意到这个例子每次都有效。我认为jsFiddle实际上是这里的罪魁祸首（可能是hashchange事件，或者是你按下'run'之后在其中一个窗格上的一些焦点事件 - 我没有深深挖过它。）

编辑 :(抱歉，已经晚了）看起来“问题”的根本原因是Firefox。不确定这是否是设计行为，但从我所看到的，看起来Firefox 将不允许在不同内容窗格中的两个不同输入元素中同时选择文本同一页。这似乎不会影响Chrome（并且假设是IE9）。

我在本地制作了一个快速示例，它有两个并排的iframe（让我们左右调用它们）。左边包含一个textarea，右边包含你的jquery-ui对话框 - 类似于你发布的小提琴。 right有以下代码：

<script type="text/javascript">
$('<div><input type="text" value="val" /></div>').dialog();
$('input').select();
</script>

left有以下代码：

<script type="text/javascript">
setTimeout( function() {
    $('textarea').focus();
}, 1000);
</script>

如果你将这些拼凑在一起并在Firefox中查看结果，你会注意到输入被聚焦并被选中，直到左边的textarea被聚焦。我怀疑在jsFiddle中发生了类似于此的事情。

Answer 2

尝试使用ui对话框的open事件。打开对话框时会触发此事件。

$('<div><input id="yourInput" type="text" value="val" /></div>').dialog({
    open:function(){
     $("#yourInput").focus().select();
    }
        }
)

http://jsfiddle.net/sergeir82/A6Wah/8/

http://jsbin.com/etivej/4/

Answer 3

这是dom中的FF问题，确定您是否设置了DOCTYPE。没有很好的方法来解决它，一个聚焦的计时器往往是“黑客”。但是还有另一个步骤，如果您的Doctype设置为w3 xhtml标准，则可以使用this来选择焦点。添加onfocus="this.select();"作为输入的属性，以便在聚焦时立即选中它。

jqueryui对话框无法在firefox 11中输入`select（）`

3 个答案: