JQuery accordion prevents bubbling / allow default action

Question

I have an accordion setup like this:

$('.shortheadline').accordion({ active: false, header: '.headline', autoHeight: false, animated: 'slowslide', changestart: function(event, ui) { $('.brief').css('min-height','0') }, change: function(event, ui) { $('.brief:visible').css('min-height','80px'); $('.headline').blur(); } }); 

I want the click to register only in div.headline, and not inside. The link should go to the article page.

  <div class="shortheadline"> <div class="entry"> <div class="headline"> <div class="timestamp">11:34 AM</div> <div class="title"><a href="http://beta.macobserver.com/tmo/article/jeff_gamet_shares_iphone_tips_and_tricks_on_macjury/">Jeff Gamet Shares iPhone Tips and Tricks on MacJury</a></div> </div> <div class="brief"> <div class="teaser_image"> <img src="/imgs/cache/imgs/teaser_images/20090708macjury_new-0x80.png" width="80" height="80" id="teas_48236" alt="macJuryJeff Gamet Shares iPhone Tips and Tricks on MacJury" /></div> <div class="teaser"><p><em>The Mac Observer's</em> Jeff Gamet joined <em>MacJury</em> host Chuck Joiner to talk about Apple iPhone OS 3.0, the iPhone 3GS, and to share some iPhone tips and tricks, too.</p> </div> </div> </div> <!-- more entries --> </div> 

Is there a way to prevent event bubbles, so the accordion only works when I click on a div? Or is there a way to allow the default action for links?

I tried:

 $("a").click(function(){ window.location=this.href; }); 

What the link function does, but it does not allow the user to open the link in a new tab / window.

Thanks!

Answer 1

Try

 $("a").click(function(event){ event.stopPropagation(); }); 

The click function passes the 'event' object. By calling the stopPropagation method of an event object, you can prevent bubbles.

Answer 2

I came across this alternative syntax that worked for me;

 $("a").bind("click", function(e) {e.stopPropagation();});