How can I prevent a main menu item with sub items from being clickable in Wordpress?

Question

Here is my site: http://wake9.com/blogs/norcal-merced-wakesurfing-competition-2009/.

Notice the menu item "Photos and Results". Hover over it and you will see sub menu items. I want to be able to click on the sub-menu items but the main menu item shouldn't be a page or be clickable. The only way i could get this item on the menu was to make it a page. Is there a way to just have a menu item that has sub menu items to content, but the actual menu item isn't clickable? I was thinking about using JQuery to remove the anchor tag, but that is a real hack and I want to know if there is an easier way.

Thanks in advance!

Answer 1

One option would be to use Page Links to plugin and set the main link as '#' . I tried this and it works in my blog.

Answer 2

What about using the jQuery.remove to remove the element?

something like this:

function removeLinkAttrib() {
  var attrib =  jQuery(#menus).find("a").attr("Photos and Results");
  jQuery(attrib).remove;
}

I'm not sure if $(attrib).remove; will work, but you get the picture :)

Answer 3

(this answer is for people using Wordpress.com free sites):

You can go to Appearance > Menus, then add a custom link to the menu by clicking 'Links' in the left-hand column, and adding "#" as the URL (and whatever you want as a label). Then add this link to the menu. Open the options for the new menu item in 'Menu Structure', and then delete '#' from the URL, so the field is blank, and save changes. Now you can add sub-menus to this menu item, and there will be no link for this item on the main menu...works for me.