Error in menu with jQuery function

Question

Error in menu with jQuery function

Navigation

#1 by (1 votes)

1

I have the following code:

<script type = "text/javascript">
    lightbox.option({
      'alwaysShowNavOnTouchDevices': true
    });
    listapremier();
    $(function(){
                $('a').click(function(e){
                        e.preventDefault();
                        var div = $(this).data('href');
                        var y = $(div).offset().top - 70;
                        $('body,html').stop(true,true).animate({                                
                                scrollTop: y
                        },1000);
                });
        });
</script>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation" style = "padding-bottom: 25px; padding-top: 25px;">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="titulogo"  style = "text-decoration: none" href="#"><img src ="img/logo.png"></img></a>
        </div>
        <div class="collapse navbar-collapse navbar-right" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav">
                <li>
                    <a data-href='#mycarousel' href='#'>INICIO</a>
                </li>
                <li>
                    <a data-href='#nosotros' href='#'>NOSOTROS</a>
                </li>
                <li>
                    <a  data-href='#servicios' href='#'>SERVICIOS</a>
                </li>
                <li>
                    <a  data-href='#propiedades' href='#'>PROPIEDADES</a>
                </li>
                <li>
                    <a  data-href='#contacto' href='#'>CONTACTO</a>
                </li>
                <li>
                    <a href="#" onclick="confiaprop()">CONFIANOS TU PROPIEDAD</a>
                </li>
                <li>
                    <a href="Registro/index.php" style = "background-color: #d5b560; color: black;">ÁREA DE INVERSIONISTAS</a>
                </li>
            </ul>
        </div>
    </div>
</nav><br /><br /><br /><br /><br />

Everything works perfect except for this button:

                <li>
                    <a href="Registro/index.php" style = "background-color: #d5b560; color: black;">ÁREA DE INVERSIONISTAS</a>
                </li>

It is the only one that has a link to another index, it only gives me an error when I insert the script that I have up in javascript, without the script if the button works.

mysql javascript jquery html php

asked by Sergio Camilo 10.03.2017 в 01:58

source

1 answer

Exit button does not autodirect to the back page asp c # Update the image view when replacing it in the source folder without reloading the page

score 1 · Accepted Answer

The problem is because of the e.preventDefault(); function in your javascript.

It works well with most navbar links because they are empty (they do not have href or this points to # ) and the action is solved by javascript. But the last link has a well defined href , and the e.preventDefault(); prevents it from running (preventDefault="prevent the default action", that is, follow the href of the link).

Your option would be to distinguish in some way the "normal" links (with href) from the rest of the links in the navbar, and only the latter link them using javascript.

One way to do this would be to modify the <a> tags of the navbar (all except the last one) by adding a distinctive class.

<a data-href='#mycarousel' href='#' class="item-menu">INICIO</a>

And modify the javascript to activate only the links that have this class:

// $('a').click(function(e){           // Esto se elimina
$('a.item-menu').click(function(e){    // y se reemplaza con esto