javascript block the click

Question

I have this code to slide some messages,

JavaScript

$(function() {
    $('#bottom_menu li a').click(function(e) {
        e.preventDefault();
        animateSlider(this.hash);
    });

    function animateSlider(hash) {
        if (!$('#container div.open').length) {
            if (hash == '#about') {
                openPopup(hash);
            }
            if (hash == '#contact') {
                openPopup(hash);
            }
        } else {
            if (hash == '#about') {
                openAndClose(hash)
            }
            if (hash == '#contact') {
                openAndClose(hash)
            }
        }
    }

    function openPopup(hash) {
        $(hash + '_popup').slideToggle().addClass('open');
    }

    function openAndClose(hash) {
        if ($(hash + '_popup').hasClass('open')) {
            $($(hash + '_popup')).slideToggle().removeClass();
        } else {
            $('#container div.open').slideToggle().removeClass();
            $(hash + '_popup').slideToggle().addClass('open');
        }
    }
});

HTML

<nav id="men55">
    <ul id="bottom_menu">
        <li style="text-align:left;">
            <a href="#about"><font face="din" size="4">onde <br />estamos</font></a>
        </li>
        <li style="text-align:left;">
            <a href="#contact"><font face="din" size="4">osnossos<br />parceiros</font></a>
        </li>
        <li style="text-align:left;">
            <a href="index2.php?web=news" <?php if($web == "news") {echo 'class="corrente"';} ?>><font face="din" size="4">news <br />press</font></a>
        </li>
    </ul>
</nav>

The problem is, when href=#contact or href=#about works fine, but if i want put a href=index2.php?web=teste don´t work... nothing happens... the problem is the javascript block the click inside nav or li

because you checking the hash - this.hash.

Elen
– Elen

2013-10-11 10:57:53 +00:00
Commented Oct 11, 2013 at 10:57 — Elen
– Elen, Commented Oct 11, 2013 at 10:57

James Donnelly · Accepted Answer · 2013-10-11 11:05:04Z

2

Simply change your initial selector to only select anchor tags whose href property starts with "#" using [href^="#"]. Change:

$('#bottom_menu li a').click(function(e) { ... });

To:

$('#bottom_menu li a[href^="#"]').click(function(e) { ... });

This will ignore any links whose href property doesn't start with "#":

#about /* Prevented */
#contact /* Prevented */
index2.php /* Ignored */
index2.php?web=teste /* Ignored */
index2.php#test /* Ignored */

edited Oct 11, 2013 at 11:05

answered Oct 11, 2013 at 10:57

James Donnelly

129k35 gold badges215 silver badges224 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Ricardo Over a year ago

Thanks, but sorry i can´t change the code like you said... can you please change my original code and send me? thanks once again

James Donnelly Over a year ago

@Ricardo on the second line of the code you've posted in your question is $('#bottom_menu li a'). Simply change that to $('#bottom_menu li a[href^="#"]'). I've edited my answer for more clarity.

Collectives™ on Stack Overflow

javascript block the click

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related