Kann nicht Skript in jQuery

Hallo Ich habe ein Skript wie dieseKann nicht Skript in jQuery

$(document).ready(function() { 

     // TODO: Make class toggle logic more efficient 

     // Global variables 
     var maxChoiceCount = 2; 

     // DOM elements 
     var choiceItems = document.querySelectorAll(".boxParent li"); 
     var maxCountLabel = document.getElementById("max-count"); 

     // Update max count label 
     maxCountLabel.textContent = maxChoiceCount; 

     // Checklist item handler 
     var checkItem = function() { 
     activeItems = document.querySelectorAll(".boxParent li.active"); 

     if (activeItems.length === maxChoiceCount) { 
      if (this.className === "active") { 
      this.className = ""; 
      } 
     } else { 
      if (this.className === "active") { 
      this.className = ""; 
      } else { 
      this.className = "active"; 
      } 
     } 
     } 

     // Handle logic to enforce max count 
     for (var i = 0, l = choiceItems.length; i < l; ++i) { 
     choiceItems[i].onclick = checkItem 
     } 
    });

Die Funktion nur für ein Zeichen geben für ein ausgewähltes <li> setzen. ich dieses Skript hineingelegt index.js und ich nenne es auf meine HTML-Seite wie folgt aus:

<script src="js/index.js"></script>

und es hat nicht funktioniert, habe es Fehler in der Konsole und sagte so:

**index.js:22 Uncaught ReferenceError: activeItems is not defined**

aber wenn ich das Skript kopieren und in den HTML-Code einfügen, funktioniert es gut.

Warum kann ich es nicht auf meiner index.js speichern?

Ich mag es nicht, viele Skripte in meinem HTML zu setzen.

Hier ist die Geige. https://jsfiddle.net/ddnvraf8/

Quelle

2016-07-10 renat natanael

Sie nach dem jquery Skript Anruf? – Gokigooooks

Stimmt irgendetwas mit der Abfrage '" .boxParent li.active "' in Ihrem HTML überein? –

yap. seine Übereinstimmung .boxParent li.active zu meinem html und ich setzte index.js nach jquery.min.js –

Versuchen Sie, eine var auf der activeItems = document.querySelectorAll(".boxParent li.active"); Zeile hinzufügen.

var activeItems = document.querySelectorAll(".boxParent li.active");

Weil es scheint nicht initialisiert werden.

Quelle

2016-07-10 02:47:00

Ich bin aber gerade ziemlich neu bei Javascripting, also dachte ich, dass das Hinzufügen einer 'var' helfen wird, die Variable zu definieren. –

Das Hinzufügen von' var' macht es zu einer lokalen Variable, ohne diese Variable ist die Variable global nur Unterschied. –

@SpencerWieczorek Danke. Aber wenn es global ist, bedeutet das auch, dass es bereits einen erklärten Wert gibt? –

das Problem genau wie der andere Kerl, der seinen Beitrag löschen. Ich habe nicht hinzugefügt var in ActiveItems = document.querySelectorAll (". boxParent li.active"); so muss es var activeItems = document.querySelectorAll(".boxParent li.active"); warum du dein post dude löschen kann nicht einen Daumen aufgeben.

Quelle

2016-07-10 02:52:04

Ich drückte den falschen Link. : v –

Die meisten, wenn nicht alle Browser, ermöglichen es Ihnen, eine Var ohne den Operator 'var' zu deklarieren. Es setzt die Variable in den globalen Bereich. Beachten Sie, dass dies eine sehr schlechte Form ist und vermieden werden sollte. Verwenden Sie window.varName, um ggf. zum globalen Bereich hinzuzufügen. Da Sie diesen Fehler sehen, klingt es wie Ihre Datei im strikten Modus ist. Dies erlaubt es nicht, globale Variablen in der Art zu deklarieren, wie Sie es getan haben. Mehr dazu: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode – jmealy

@JohnAtNotion Ich bin mir nicht sicher, aber es ist nicht erforderlich, "" streng zu verwenden ";" um den strikten Modus zu verwenden? Wenn dem so wäre, würde ich annehmen, dass sie ihren Code direkt verarbeitet und nichts hinzugefügt hat. Aber das kann trotzig den Fehler erklären, wenn sie es sind. –

Der wahrscheinlichste Grund, warum Sie diesen Fehler erhalten, ist, weil Sie Ihre JavaScript-Datei in platzieren, die die Verwendung von globalen Variablen verbietet. Da activeItems würde global Strict-Modus erklärt wird, um den Fehler geben:

Uncaught ReferenceError: activeItems is not defined

Hinweis im Strict-Modus zu sein, bedeutet haben Sie "use strict"; irgendwo in Ihrer JS-Datei, die gemeinhin an der Spitze:

"use strict"; 

// Other code

Unter normaler JavaScript (nicht im strict-mode), trotz globaler Variablen, die allgemein als schlechte Praxis bekannt ist, würden Sie in diesem Fall funktionell gleich funktionieren und keine Fehler haben. Die Lösung wäre, um die lokale Variable zu machen:

var activeItems = ... ;

Quelle

2016-07-10 03:33:22

Bitte benutzen Sie den Code-Schnipsel:

<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 
    <style type="text/css">.box{ 
    max-width:240px; 
} 
.box h4{ 
    margin: 4px 15px; 
} 
.boxParent li:last-child{ 
    border-bottom: solid thin #d8d8d8 
} 
.boxParent li.active:after{ 
    content: "\2713"; 
    color: #F8E74E; 
} 

.boxParent li:after { 
    background: #fff; 
    border-radius: 50%; 
    content: ""; 
    display: inline-block; 
    height: 24px; 
    line-height: 24px; 
    position: absolute; 
    right: 10px; 
    text-align: center; 
    width: 24px; 
} 
.boxParent li.active { 
    background: #fff; 
    font-weight: 700; 
}</style> 
<script src="https://code.jquery.com/jquery-1.10.2.js"></script> 
<script type="text/javascript" src="index.js"></script> 
</head> 
<body> 
<div class="box"> 
    <div class="box-header"> 
    <h4>Categories</h4> 
    </div> 
    <div class="boxCaption"> 
    <h3 style="display:none;">Select up to <span id="max-count">0</span> choices</h3> 
    <ul class="boxParent"> 
     <li>Lorem ipsum</li> 
     <li>Lorem ipsum dolor </li> 
     <li>Lorem ipsum dolor sit amet.</li> 
     <li>Lorem ipsum dolor sit </li> 
     <li>Lorem ipsum dolor sit amet.</li> 
     <li>Lorem ipsum </li> 
    </ul> 
    </div> 
</div> 
</body> 
</html>

In index.js:

$(document).ready(function() { 

      // TODO: Make class toggle logic more efficient 

      // Global variables 
      var maxChoiceCount = 2; 

      // DOM elements 
      var choiceItems = document.querySelectorAll(".boxParent li"); 
      var maxCountLabel = document.getElementById("max-count"); 

      // Update max count label 
      maxCountLabel.textContent = maxChoiceCount; 

      // Checklist item handler 
      var checkItem = function() { 
      activeItems = document.querySelectorAll(".boxParent li.active"); 

      if (activeItems.length === maxChoiceCount) { 
       if (this.className === "active") { 
       this.className = ""; 
       } 
      } else { 
       if (this.className === "active") { 
       this.className = ""; 
       } else { 
       this.className = "active"; 
       } 
      } 
      } 

      // Handle logic to enforce max count 
      for (var i = 0, l = choiceItems.length; i < l; ++i) { 
      choiceItems[i].onclick = checkItem 
      } 
     });

Hoffnung das Ihr Problem löst. Vielen Dank.

Quelle

2016-07-10 04:57:49

activeItems = document.querySelectorAll (".boxParent li.aktiv ");

Ihre Variable nicht deklarierten ist

var activeItems = document.querySelectorAll (." boxParent li.active ");

Quelle

2016-07-10 05:40:02

Kann nicht Skript in jQuery

Antwort

Verwandte Themen