0

Ich versuche, eine if/else-Anweisung einrichten, dass, wenn eine Klasse existiert dann die var num wird gleich 100, wenn die Klasse nicht existiert dann var num wird gleich 55. num ist dann verwendet, um zu verstehen, wie viele Pixel der Bildschirm versetzt wird. Jede Hilfe wird geschätzt, da Javascript eine meiner Schwachstellen ist.Wenn/Else jQuery bricht mein Skript

// Add scrollspy to <body> 
$('body').scrollspy({target: ".navbar", offset: 55}); 

// Checks to see if navbar is affixed or not 
if (($(".affix-top")[0]){) { 
    num = 100; 
} else { 
    num = 55; 
} 

// Add smooth scrolling on all links inside the navbar 
$(".navbar-lower a").on('click', function(event) { 

    // Make sure this.hash has a value before overriding default behavior 
    if (this.hash !== "") { 

    // Prevent default anchor click behavior 
    event.preventDefault(); 

    // Store hash 
    var hash = this.hash; 

    // Using jQuery's animate() method to add smooth page scroll 
    // The optional number (300) specifies the number of milliseconds it takes to scroll to the specified area 
    $('html, body').animate({ 
     scrollTop: $(hash).offset().top - num 
    }, 300, function(){ 

    // Add hash (#) to URL when done scrolling (default click behavior) 
     window.location.hash = hash; 
    }); 

    } // End if 

}); 
+7

Haben Sie Ihre Konsole überprüft? ... 'if (($ (". affix-top ") [0]) {) {' – mhodges

+0

@mhodges wenn ich das in meine Konsole einfüge, gibt es 'Uncaught SyntaxError: Unexpected token {' – Cody

+2

Das ist was sie ' erzähle es dir. Ihr Code (den sie genau kopiert haben) hat einen Syntaxfehler – Brennan

Antwort

0

gehört sein Das ist schwer zu lesen.

if (($(".affix-top")[0]){) { 
    num = 100; 
} else { 
    num = 55; 
} 

Es kann vereinfacht werden, dies nur, weil abgestimmt alles wahr ist.

Das wird nicht funktionieren, wenn das Skript ausgeführt wird, bevor der Rest der HTML-Seite geladen wurde.

<script type="application/javascript"> $(".affix-top").length > 0; // false </script> 
<div class="affix-top"></div> 
<script type="application/javascript"> $(".affix-top").length > 0; // true </script> 

Also alles in einen jQuery bereiten Block wickeln.

jQuery(document).ready(function(){ 
     var num = $(".affix-top").length ? 100 : 55; 
     //....... insert more code here 
    }); 
+0

Ich habe versucht, dies zu verwenden, aber es druckt immer noch die zweite Nummer jedes Mal aus, auch wenn die Klasse nicht existiert. – Cody

+0

@Cody Affix hat Ereignisse, auf die Sie achten können. Das könnte eine bessere Funktionalität bieten als die CSS-Klasse. Werfen Sie einen Blick auf: http://www.tutorialrepublic.com/twitter-bootstrap-tutorial/bootstrap-affix.php – cgTag

0

Sie brauchen die zusätzlichen Klammern nicht. Überprüfen Sie auch .length, ob ein Element vorhanden ist. Es ist subjektiv, aber IMO macht es leichter zu lesen.

if ($(".affix-top").length) { 
    num = 100; 
} else { 
    num = 55; 
} 
0

Sie haben eine {wo es nicht

if (($(".affix-top")[0]){) { 

sollte

if (($(".affix-top")[0])) {