ContentEditable focus in Chrome/Safari

Question

I have a contenteditable div which needs to be focussed at pageload (place cursor at the first line).

document.getElementById(\"editor\").focus() works

Answer 1

I was able to add focus to a DIV by calling the focus() method chained to the attr() method

$el.attr('contenteditable', "true").focus()

Answer 2

This question may no longer be relevant to the questioner but I'll answer it for future readers. The basic principle is to set the selection to a collapsed range at the start of the element.

I solved this problem by using the Rangy JS library: http://code.google.com/p/rangy

var r = rangy.createRange();
r.setStart( document.getElementById('editor'), 0 );
r.collapse(true);
rangy.getSelection().setSingleRange(r);

This might be more than is necessary but it definitely works cross-browser and Rangy provides a bunch of extra utilities as well so it's probably worth looking into :)