If I have a text page as described below. The call to $("#target").focus(); in the $() section in the header works just fine. I can also bind that command to events in a more realistic page.
However, if I open the chrome console and type $("#target").focus(); it does not change focus. If I run $("#target").val("something"); it changes the value on the screen, but it does not work with focus.
Obviously this isn’t a critical problem, but I am really curious why this happens. Anyone have an idea?
<html>
<head>
<script src="jquery-1.9.1.js"></script>
<script>
$(function(){
$("#target").focus();
});
</script>
</head>
<body>
<input id="target" type="text">
</body>
</html>
You will realize that when clicking on the Chrome console, it will steal focus from any input or textarea control on the current page, and vice versa. That’s because the Chrome console actually is implemented using the same HTML controls as any other HTML page, just with special properties which, for instance, prevent Chrome from inspecting the Chrome console recursively.
When you type a command in the Chrome console, i.e. in the input control that is part of the Chrome console, it will keep the focus. The Chrome engineers might have chosen to implement it differently, but in most cases the user will want to continue typing in the Chrome console after firing a command, so no command will release focus from the console.