聚焦ContentEditable div

Question

我希望聚焦可内容的div，以便在将其插入DOM时自动开始键入。

我试过$('.content').focus()，但这不起作用

示例html：

<div class="content" contenteditable="true">sample input</div>

Answer 1

我认为您可能只需要将代码包装在一个window.load函数中：

​

$(window).on("load",function(){
  $('.content').focus();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="content" contenteditable="true">sample input</div>

(小提琴： http://jsfiddle.net/hxeqm541/)

​

这样做的目的是，在执行window.load中的代码之前，等待页面完全加载。

如果不这样做，将在页面上甚至在div存在之前执行集中在div上的代码，这是不可能的。当div最终存在于页面上时，代码已经运行，所以不会再发生任何事情了。

边注：

• 因为您按类引用div ($('.content'))，如果有多个具有相同类名的div，那么只有最后一个才会收到焦点。见example。
• 您的不需要将每个单独的代码块包装在window.load中。 通常，您可以将整个JavaScript代码包装在window.load中。该规则可能有几个例外，请阅读this和this，以充分了解window.load机制的工作原理，这样您将确切地知道如何使用它。 (请注意，在第二个链接中，.load也可以用于其他元素。)