JQuery .on Ereignis Brennen nicht in Chrom

-1

Ich versuche, einige Sache zu reproduzieren, die auf Codecademy funktioniert: https://www.codecademy.com/en/courses/web-beginner-en-v6phg/2/5?curriculum_id=50a3fad8c7a770b5fd0007a1 JQuery .on Ereignis Brennen nicht in Chrom

Allerdings, wenn ich die html kopiert unten, CSS und JS-Dateien und lief es mit Google Chrome, nichts arbeitete. Ich bemerkte die fehlende <script> Verbindung zu Jquery und fügte sie hinzu, und reparierte die "addieren" Funktion; Der 'Teil entfernen' hat jedoch nie funktioniert.

Ps. Ich stellte sicher, dass das Skript korrekt verbunden ist, indem ich eine alert hinzufüge, die gefeuert hat. Hier

ist die html:

<!DOCTYPE html> 
<html> 
    <head> 
     <title>To Do</title> 
     <link rel="stylesheet" type="text/css" href="stylesheet.css"/> 
     <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js?ver=1.4.2'></script> 
     <script type="text/javascript" src="script.js"></script> 
    </head> 
    <body> 
     <h2>Checklist</h2> 
     <form name="checkListForm"> 
      <input type="text" name="checkListItem"/> 
     </form> 
     <div id="button">Add!</div> 
     <br/> 
     <div class="list"></div> 
    </body> 
</html>

und jquery (js) file:

$(document).ready(function() { 
    $('#button').click(function() { 
     var toAdd = $('input[name=checkListItem]').val(); 
     $('.list').append('<div class="item">' + toAdd + '</div>'); 
     $('input[name=checkListItem]').val(''); 
    }); 
    $(document.body).on('click', '.item', function(event) { 
     $(this).remove(); 
    }); 
});

Quelle

2016-10-17 Jingjie YANG

So ist IE klug? –

ich nur das Problem herausgefunden alte Version von jQuery zu verwenden. Sie verwenden 1.4.2, die die .on() Funktion nicht aufweist.

<script type='text/javascript' 
     src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js?ver=1.4.2'></script> 
<!-------------------------------------------------------^^^^^

Lösung: die neueste Version von jQuery 1.x verwenden, die 1.12 ist.

Aus dem Handbuch:

Ich würde wirklich vorschlagen, dass Sie die Konsole zu überprüfen, bevor hier etwas zu veröffentlichen.

Quelle

2016-10-17 18:48:31

ja durch die Aktualisierung der Bibliothek funktioniert es auch für mich – Farhan

Die Verwendung der neuesten jQuery-Version ist überhaupt keine gute Idee zum Lernen. Für Anfänger sollte es "kleiner als 1,6", "1,6 oder größer" und "2,2,4 oder kleiner" sein. Keine Notwendigkeit, 3.x-Version zu verwenden. –

@HappyCoding Ich habe die Antwort Mate aktualisiert ... Ich meinte nur 1.x ... Sogar jetzt benutze ich nur 1.x. Wenn du der Downvoter bist, würdest du mir gerne vorschlagen, ob es noch etwas zu ändern gibt? –

Wenn Sie mit der alten Bibliothek festkleben, verwenden Sie .live() anstelle von .on(). Hoffe, das wird für dich funktionieren.

$(document).ready(function() { 
    $('#button').click(function() { 
     var toAdd = $('input[name=checkListItem]').val(); 
     $('.list').append('<div class="item">' + toAdd + '</div>'); 
     $('input[name=checkListItem]').val(''); 
    }); 
    $(".item").live('click', function() { 
     $(this).remove(); 
    }); 
});

Demo:https://jsfiddle.net/8s19ehh8/5/

Quelle

2016-10-17 19:10:59 Farhan

JQuery .on Ereignis Brennen nicht in Chrom

Antwort

Verwandte Themen