Das Ereignis click () ruft in jquery zweimal auf

Ich habe ein Link-Element eingerichtet und sein Klick-Ereignis in jquery aufgerufen, aber das Klick-Ereignis wird zweimal aufgerufen. Siehe unten den Code von jquery.

$("#link_button")
.button()
.click(function () {
   $("#attachmentForm").slideToggle("fast");
});

Bitte beraten.

Vielen Dank.

Stellen Sie sicher, dass Sie Ihr Skript nicht versehentlich zweimal in Ihre HTML-Seite aufgenommen haben.

Lösen Sie die Bindung vor dem Klicken.

$("#link_button").unbind('click');
$("#link_button")
.button()
.click(function () {
   $("#attachmentForm").slideToggle("fast");
});

Dies bedeutet, dass Ihr Code das jquery-Skript zweimal enthielt. Aber versuchen Sie Folgendes:

$("#btn").unbind("click").click(function(){

//your code

});

Ich versuchte es e.stopImmediatePropagation(); Das scheint bei mir zu funktionieren.

In meinem Fall habe ich das folgende Skript verwendet, um das Problem zu beheben

$('#id').off().on('click',function(){
    //...
});

off()bindet alle Ereignisse, an die gebunden ist #id. Wenn Sie nur das clickEreignis aufheben möchten , verwenden Sie off('click').

Rufen Sie einfach .off () auf, bevor Sie .on () aufrufen.

Dadurch werden alle Ereignishandler entfernt:

$(element).off().on('click', function() {
// function body
});

So entfernen Sie nur registrierte 'Click'-Ereignishandler:

$(element).off('click').on('click', function() {
// function body
});

Eine ziemlich häufige Lösung für das Zwei-Klick-Problem ist das Putten

e.stopPropagation()

am Ende Ihrer Funktion (vorausgesetzt, Sie verwenden function(e)das ist). Dies verhindert, dass das Ereignis in die Luft sprudelt, was zu einer zweiten Ausführung der Funktion führen kann.

Ich hatte das gleiche Problem, aber Sie können versuchen, diesen Code zu ändern

$("#link_button")
.button()
.click(function () {
   $("#attachmentForm").slideToggle("fast");
});

dazu:

$("#link_button").button();
$("#link_button").unbind("click").click(function () {
   $("#attachmentForm").slideToggle("fast");
});

Für mich hat dieser Code das Problem gelöst. Achten Sie jedoch darauf, dass Sie Ihr Skript nicht versehentlich zweimal in Ihre HTML-Seite aufnehmen. Ich denke, wenn Sie diese beiden Dinge richtig machen, wird Ihr Code richtig funktionieren. Vielen Dank

Bitte versuchen Sie dies

$('#ddlSupervisor').live('change', function (e) {
    if (e.handled !== true) { //this makes event to fire only once
    getEmployeesbySupervisor();
    e.handled = true;
   }
});

Dies ist definitiv ein Fehler, besonders wenn es sich um FireFox handelt. Ich habe viel gesucht, alle oben genannten Antworten ausprobiert und es schließlich von vielen Experten über SO als Fehler erhalten. Also kam ich schließlich auf diese Idee, indem ich eine Variable wie deklarierte

var called = false;
$("#ColorPalete li").click(function() {
    if(!called)
    {
             called = true;
             setTimeout(function(){ //<-----This can be an ajax request but keep in mind to set called=false when you get response or when the function has successfully executed.
                 alert('I am called');
                 called = false;
             },3000);

    }
});

Auf diese Weise wird zunächst geprüft, ob die Funktion zuvor aufgerufen wurde oder nicht.

Das Hinzufügen e.preventDefault();zu Beginn meiner Funktion hat bei mir funktioniert.

Dies ist eine ältere Frage, aber wenn Sie die Ereignisdelegierung verwenden, hat dies für mich verursacht.

Nach dem Entfernen wurde .delegate-twodie Ausführung zweimal beendet. Ich glaube, das passiert, wenn beide Delegierten auf derselben Seite anwesend sind.

$('.delegate-one, .delegate-two').on('click', '.button', function() {
    /* CODE */
});

Dieser Codeausschnitt enthält nichts Schlechtes. Es ist ein weiterer Teil Ihres Skripts, wie @karim sagte

In meinem Fall funktionierte es in Chrome einwandfrei und der IE rief .click()zweimal an. Wenn das Ihr Problem war, habe ich es behoben, indem ich false zurückgegeben habe, nachdem ich das .click()Ereignis aufgerufen habe

   $("#txtChat").keypress(function(event) {
        if (event.which == 13) {
            $('#btnChat').click();
            $('#txtChat').val('');
            return false;
        }
    });

Anruf unbindlöste mein Problem:

$("#btn").unbind("click").click(function() {
    // your code
});

Ich bin mir nicht sicher warum, aber ich hatte dieses Problem mit

$(document).on("click", ".my-element", function (e) { });

Als ich es geändert habe

$(".my-element").click(function () { });

Problem wurde gelöst. Aber definitiv stimmt etwas in meinem Code nicht.

Ich wurde von einer Auswahl ausgetrickst, die mehreren Elementen entspricht, sodass auf jedes geklickt wurde. :firstgeholfen:

$('.someClass[data-foo="'+notAlwaysUniqueID+'"]:first').click();

Ich hatte auch dieses Problem auf FF. Mein Tag war jedoch an ein <a>Tag gebunden . Obwohl das <a>Tag nirgendwo hinging, machte es immer noch den Doppelklick. Ich habe stattdessen das <a>Tag gegen ein <span>Tag ausgetauscht und das Problem mit dem Doppelklick ist verschwunden.

Eine andere Alternative besteht darin, das href-Attribut vollständig zu entfernen, wenn der Link nirgendwo hingeht.

Ich war mit diesem Problem konfrontiert, weil mein $(elem).click(function(){});Skript in einem Div, das auf eingestellt war, inline platziert wurde style="display:none;".

Wenn die CSS-Anzeige auf Block geschaltet wurde, fügte das Skript den Ereignis-Listener ein zweites Mal hinzu. Ich habe das Skript in eine separate JS-Datei verschoben und der Listener für doppelte Ereignisse wurde nicht mehr initiiert.

Wenn ich diese Methode beim Laden einer Seite mit jquery verwende, schreibe ich $('#obj').off('click'); bevor einstelle, damit die Blase nicht auftritt. Funktioniert bei mir.

Meine einfache Antwort war, die Klickbindung in eine Funktion umzuwandeln und diese vom Klicken des Elements aus aufzurufen - ein Vergnügen! während keines der oben genannten tat

Wenn Ihre Veranstaltung zwei- oder dreimal oder öfter anruft, kann dies hilfreich sein.

Wenn Sie so etwas verwenden, um Ereignisse auszulösen ...

$('.js-someclass').click();

… .js-someclassAchten Sie dann auf die Anzahl der Elemente auf der Seite, da dies das Klickereignis für alle Elemente auslöst - und nicht nur einmal!

Eine einfache Lösung besteht darin, sicherzustellen, dass Sie den Klick nur einmal auslösen, indem Sie nur das erste Element auswählen , z.

$('.js-someclass:first').click();

Sicher, irgendwo anders in Ihren Skripten wird das "Klick" -Ereignis wieder an dasselbe Element gebunden, wie mehrere andere Antworten / Kommentare vorschlagen.

Ich hatte ein ähnliches Problem und um dies zu überprüfen, habe ich console.logmeinem Skript einfach einen Befehl hinzugefügt , wie im folgenden Snippet:

$("#link_button")
    .button()
    .click(function () {
        console.log("DEBUG: sliding toggle...");
        $("#attachmentForm").slideToggle("fast");
    });

Wenn Sie beim Klicken auf die Schaltfläche von der Entwicklerkonsole Ihres Browsers (wie ich) etwas Ähnliches wie das folgende Bild erhalten, wissen Sie sicher, dass das click()Ereignis zweimal an dieselbe Schaltfläche gebunden wurde.

Wenn Sie einen schnellen Patch benötigen , funktioniert die von anderen Kommentatoren vorgeschlagene Lösung für die Verwendung der offMethode (übrigens unbindist sie seit jQuery 3.0 veraltet) zum Aufheben der Bindung des Ereignisses vor dem (erneuten) Binden gut. Ich empfehle sie auch:

$("#link_button")
    .button()
    .off("click")
    .click(function () {
        $("#attachmentForm").slideToggle("fast");
    });

Leider ist dies nur ein vorübergehender Patch! Sobald das Problem, Ihren Chef glücklich zu machen, gelöst ist, sollten Sie sich ein wenig mehr mit Ihrem Code befassen und das Problem der "doppelten Bindung" beheben.

Die tatsächliche Lösung hängt natürlich von Ihrem spezifischen Anwendungsfall ab. In meinem Fall gab es zum Beispiel ein Problem mit dem "Kontext". Meine Funktion wurde als Ergebnis eines Ajax-Aufrufs aufgerufen, der auf einen bestimmten Teil des Dokuments angewendet wurde: Beim erneuten Laden des gesamten Dokuments wurden sowohl der Kontext "Seite" als auch der Kontext "Element" neu geladen, was dazu führte, dass das Ereignis zweimal an das Element gebunden wurde .

Meine Lösung für dieses Problem war es , die jQuery zu nutzen eine Funktion, die die gleichen wie auf mit der Ausnahme , dass das Ereignis nach dem ersten Aufruf automatisch ungebunden ist. Das war ideal für meinen Anwendungsfall, aber auch hier ist es möglicherweise nicht die Lösung für andere Anwendungsfälle.

Hatte das gleiche Problem. Das hat bei mir funktioniert -

$('selector').once().click(function() {});

Hoffe das hilft jemandem.

In meinem Fall wurde der HTML-Code folgendermaßen angelegt:

<div class="share">
  <div class="wrapper">
    <div class="share">
    </div>
  </div>
</div>

Und meine jQuery war so:

jQuery('.share').toggle();

Es verwirrte mich, weil nichts zu passieren schien. Das Problem war, dass das innere .shares toggle das äußere .shares aufheben würde toggle.

Ich habe dieses Problem gelöst, indem ich den Elementtyp geändert habe. Anstelle der Schaltfläche platziere ich Eingaben, und dieses Problem tritt nicht mehr auf.

instesd von:

<button onclick="doSomthing()">click me</button>

ersetzen mit:

<input onclick="doSomthing()" value="click me">