click () olayı jquery'de iki kez arıyor

Bir bağlantı öğesi kurdum ve tıklama olayını jquery'de çağırdım ancak tıklama olayı iki kez çağırıyor, lütfen aşağıdaki jquery koduna bakın.

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

Tavsiye lütfen.

Teşekkürler.

Komut dosyanızı yanlışlıkla HTML sayfanıza iki kez eklemediğinizden emin olun ve kontrol edin.

Tıklamadan önce bağlantıyı kaldırın;

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

Bu, kodunuzun jquery betiğini iki kez içerdiği anlamına gelir. Ama şunu dene:

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

//your code

});

Denedim e.stopImmediatePropagation(); Bu benim için çalışıyor gibi görünüyor.

Benim durumumda, sorunun üstesinden gelmek için aşağıdaki komut dosyasını kullandım

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

off()bağlandığı tüm olayları çözer #id. Yalnızca clickolayı çözmek istiyorsanız , o zaman kullanın off('click').

.On () öğesini aramadan hemen önce .off () çağrısı yapmanız yeterlidir.

Bu, tüm olay işleyicilerini kaldıracak:

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

Yalnızca kayıtlı 'tıklama' olay işleyicilerini kaldırmak için:

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

İki tıklama sorununun oldukça yaygın bir çözümü,

e.stopPropagation()

işlevinizin sonunda (bunu kullandığınızı varsayarak function(e)). Bu, işlevin ikinci kez çalıştırılmasına yol açabilecek olayın köpürmesini önler.

Aynı sorunu yaşadım, ancak bu kodu değiştirmeyi deneyebilirsiniz

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

buna:

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

Benim için bu kod sorunu çözdü. Ancak komut dosyanızı yanlışlıkla HTML sayfanıza iki kez eklememeye dikkat edin. Bu iki şeyi doğru yapıyorsanız kodunuzun doğru çalışacağını düşünüyorum. Teşekkürler

lütfen bunu dene

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

Bu kesinlikle FireFox iken özellikle bir hatadır. Yukarıdaki cevapların hepsini denedim ve sonunda SO üzerinden birçok uzman tarafından hata olarak aldım. Böylece, nihayet bu fikri şu şekilde değişken tanımlayarak buldum:

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);

    }
});

Bu şekilde, önce işlevin daha önce çağrılıp çağrılmadığını kontrol eder.

İşlevimin e.preventDefault();başlangıcında ekleme yapmak benim için çalıştı.

Bu daha eski bir soru, ancak olay yetkilendirme kullanıyorsanız benim için buna neden olan buydu.

Kaldırdıktan sonra .delegate-twoiki kez çalıştırmayı durdurdu. Her iki delege de aynı sayfada bulunursa bunun olacağına inanıyorum.

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

bu kod parçacığı kötü bir şey içermiyor. @Karim'in söylediği gibi senaryonuzun başka bir parçası

Benim durumumda, Chrome'da iyi çalışıyordu ve IE .click()iki kez arıyordu . Eğer sorununuz buysa, .click()olayı çağırdıktan sonra yanlış döndürerek sorunu düzelttim

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

Arama unbindsorunumu çözdü:

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

Neden olduğundan emin değilim ama bu sorunu yaşadım

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

Olarak değiştirdiğimde

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

Sorun çözüldü. Ama kodumda kesinlikle yanlış bir şeyler var.

Birden çok öğeyle eşleşen bir seçimle kandırıldım, böylece her biri tıklandı. :firstyardım etti:

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

Ben de FF'de bu sorunu yaşadım. Ancak etiketim bir <a>etikete bağlıydı . Gerçi <a>etiketi hiçbir yere gitmiyordu hala çift tıklayın yaptı. Bunun yerine <a>etiketi bir <span>etiketle değiştirdim ve çift tıklama sorunu ortadan kalktı.

Başka bir alternatif, bağlantı hiçbir yere gitmiyorsa href özelliğini tamamen kaldırmaktır.

Bu sorunla karşılaştım çünkü $(elem).click(function(){});komut dosyam şu şekilde ayarlanmış bir div'e satır içi olarak yerleştirildistyle="display:none;" .

Css görüntüsü blok olarak değiştirildiğinde, komut dosyası olay dinleyicisini ikinci kez ekler. Komut dosyasını ayrı bir .js dosyasına taşıdım ve yinelenen olay dinleyicisi artık başlatılmadı.

Bu yöntemi jquery ile yükleme sayfasında kullandığımda $('#obj').off('click');, tıklama işlevini ayarlamadan önce yazıyorum , böylece kabarcık oluşmasın. Benim için çalışıyor.

Benim basit cevabım, tıklama bağlantısını bir işleve dönüştürmek ve bunu öğenin bir kez tıklanmasıyla aramak oldu - bir zevkti! oysa yukarıdakilerin hiçbiri yapmadı

Etkinliğiniz iki veya üç kez veya daha fazla arıyorsa, bu yardımcı olabilir.

Olayları tetiklemek için buna benzer bir şey kullanıyorsanız ...

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

... sonra sayısına dikkat edin .js-someclass sayfadaki öğelerin edin, çünkü tüm öğeler için tıklama olayını tetikleyecektir - sadece bir kez değil!

O halde basit bir düzeltme, yalnızca ilk öğeyi seçerek tıklamayı yalnızca bir kez tetiklediğinizden emin olmaktır , örneğin:

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

Elbette, komut dosyanızın başka bir yerinde, "tıklama" olayı, diğer birkaç yanıtın / yorumun önerdiği gibi, aynı öğeye yeniden bağlanıyor.

Benzer bir sorun yaşadım ve bunu doğrulamak için, console.logaşağıdaki kod parçacığında olduğu gibi komut dizime bir komut ekledim :

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

Düğmeye tıkladığınızda, tarayıcınızın geliştirici konsolundan aşağıdaki resme benzer bir şey görürseniz (benim yaptığım gibi), click()etkinliğin aynı düğmeye iki kez bağlandığından emin olursunuz .

Hızlı bir yamaya ihtiyacınız varsa, diğer yorumcular tarafından önerilen off( unbindjQuery 3.0'dan beri btw kullanımdan kaldırılmıştır) çözüm, (yeniden) bağlamadan önce olayı çözmek için iyi çalışıyor ve ben de tavsiye ederim:

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

Ne yazık ki, bu yalnızca geçici bir yama! Sizi patron mutlu etme sorunu çözüldüğünde, kodunuzu biraz daha araştırmalı ve "çoğaltılmış bağlama" sorununu gidermelisiniz.

Gerçek çözüm elbette sizin özel kullanım durumunuza bağlıdır. Benim durumumda, örneğin, bir "bağlam" sorunu vardı. Belgenin belirli bir bölümüne uygulanan bir Ajax çağrısının sonucu olarak işlevim çağrılıyordu: tüm belgeyi yeniden yüklemek aslında hem "sayfa" hem de "öğe" bağlamlarını yeniden yüklüyordu, bu da olayın öğeye iki kez bağlanmasıyla sonuçlanıyordu .

Bu sorunun çözümü benim jQuery kaldıraç oldu biri aynıdır işlevi, üzerindeki olay ilk çağırma sonra otomatik olarak ilişkisiz olduğunu hariç. Bu benim kullanım durumum için idealdi, ancak yine, diğer kullanım durumları için çözüm olmayabilir.

Aynı sorunu yaşadım. Bu benim için çalıştı -

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

Umarım bu birine yardımcı olur.

Benim durumumda, HTML şu şekilde düzenlenmiştir:

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

Ve jQuery'm şöyleydi:

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

Kafamı karıştırdı çünkü hiçbir şey olmuyor gibiydi. Sorun, iç .shares’nin toggle dış .shares’yi iptal etmesiydi toggle.

Öğe türünü değiştirerek bu sorunu çözdüm. düğme yerine girdi koyuyorum ve bu sorun artık oluşmuyor.

anları:

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

ile değiştirin:

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