Question

I am trying to use scrollspy, but at http://twitter.github.com/bootstrap/javascript.html#scrollspy, the example seems not working, and also there is a headsup:

Heads up! Navbar links must have resolvable id targets. For example, a <a href="#home">home</a> must correspond to something in the dom like <div id="home"></div>. 

Th problem is scrollspy is just one functionality in my site which happens to be always loaded even when there is no id targets in the page, and this results in error as predicted by the headsup.

The error:

uncaught exception: Syntax error, unrecognized expression: #

The same error also happens to when I am using scrollTo.js plugin.

So I am trying to add a condition, to activate scrollspy only if there is id targets in the DOM.

  $('.nav-scrollspy').each(function() {
              var $nav = $(this).find('a');
                var linkHref = $nav.attr('href').split('#')[1];
                if ($('#' + linkHref).length) {
                $(this).scrollspy();
                }
  });

The above fails, because I think I should filter to only the first found hash from the link.

Any hint to the issue or another better way would be very much appreciated.
Thanks

Answer 1

Change this line

if ($('#' + linkHref).length) {

to

if ($.trim(linkHref).length > 0) {

and it should work fine.

The reason for this after this line

var linkHref = $nav.attr('href').split('#')[1];

linkHref is a string

so wrapping it around $ object is not necessary at all in this case and can cause error, I am using $.trim to trim off any whitespace which is not mandatory either, but a good practice in cases like this.