jQuery .focus doesn’t actually focus a newly created element

Answer 1

Instead of

$("#newP").focus();  

it should be used:

window.location.href=window.location.href + "#newP";     

Answer 2

I think the main answer is incorrect. DIV and P tags can receive focus providing you specify a tabindex property for them. i.e.

<div class="someclass" tabindex="100">

Once the tabindex is specified you can either tab to these elements or shift focus with .focus() .

Using a scrollTo plugin seems like a bit of an overkill here.

Answer 3

Only form elements and such can attain focus. If you want the browser to scroll down to that particular paragraph, there is no "default" way of doing so with jQuery, but there is a plugin for it at jQuery.ScrollTo and a blog explaining how to do it manually at Animated scroll with jQuery

Answer 4

This code will avoid dependencies on other plugins and allow you to have it on any element.

$('html, body').animate({ scrollTop: $("#newP").offset().top }, 500);

Answer 5

I think what you're looking for is using the 'ScrollTo' plugin in jQuery. You can check it out here.

You can specify what to scroll...

$('div.pane').scrollTo(...);//all divs w/class pane

Or just scroll the window:

$.scrollTo(...);//the plugin will take care of this

There are many different ways to specify the target position. These are:

• A raw number
• A string('44', '100px', '+=30px', etc )
• A DOM element (logically, child of the scrollable element)
• A selector, that will be relative to the scrollable element
• A hash { top:x, left:y }, x and y can be any kind of number/string like above.

Bonus: In digging up this information, I also found LocalScroll and SerialScroll (animates scrolling from one item to the next).

Answer 6

You need to use a HTML page anchor not focus. Example:

http://localhost/mypage.html#fourthP