подія click () викликає двічі у jquery

Я встановив елемент посилання та назвав його подія клацання у jquery, але подія натискання викликає двічі, дивіться нижче код jquery.

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

Порадьте, будь ласка.

Дякую.

Переконайтесь і переконайтеся, що ви випадково не включили свій скрипт двічі на вашу HTML-сторінку.

Зняти скасування перед натисканням;

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

Це означає, що ваш код включав сценарій jquery двічі. Але спробуйте:

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

//your code

});

Я спробував e.stopImmediatePropagation(),; Це, здається, працює для мене.

У моєму випадку я використовував наведений нижче сценарій для подолання проблеми

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

off()розв’язує всі події, на які пов'язується #id. Якщо ви хочете від’єднати лише clickподію, тоді використовуйте off('click').

Просто зателефонуйте .off () прямо перед тим, як зателефонувати .on ().

Це видалить усі обробники подій:

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

Щоб видалити лише зареєстровані обробники подій "натисніть":

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

Досить поширеним рішенням проблеми з двома клацаннями є введення

e.stopPropagation()

наприкінці вашої функції (якщо ви користуєтеся function(e)цим). Це запобігає появі барботингу події, що може призвести до другого виконання функції.

У мене була така ж проблема, але ви можете спробувати змінити цей код

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

до цього:

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

Для мене цей код вирішив проблему. Але будьте уважні, щоб випадково не включити свій скрипт двічі на вашу сторінку HTML. Я думаю, що якщо ви робите ці дві речі правильно, ваш код буде працювати правильно. Дякую

будь ласка, спробуйте це

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

Це, безумовно, помилка спеціально, коли це FireFox. Я багато шукав вищеперелічені відповіді, і, нарешті, отримав це як помилку багатьох експертів. Отже, я нарешті придумав цю ідею, оголосивши змінну типу

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

    }
});

Таким чином він спочатку перевіряє, скоріше функція була викликана чи ні.

Додавання e.preventDefault();на початку моєї функції працювало на мене.

Це питання старіше, але якщо ви використовуєте делегування подій, саме це спричинило мене.

Після вилучення .delegate-twoйого двічі перестали виконувати. Я вважаю, що це станеться, якщо на одній сторінці присутні обидва делегати.

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

цей фрагмент коду не містить нічого поганого. Це ще одна частина вашого сценарію, як розповів @karim

У моєму випадку він працював нормально в Chrome, і IE дзвонив .click()двічі. якщо це було вашою проблемою, я після виклику .click()події я виправив це шляхом повернення помилково

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

Виклик unbindвирішив мою проблему:

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

Я не знаю, чому, але у мене була ця проблема

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

Коли я змінив його на

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

Проблема була вирішена. Але напевно щось не так у моєму коді.

Мене обдурив вибір, який відповідає декільком елементам, тому кожен був натиснутий. :firstдопомогли:

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

У мене теж було це питання на ФФ. Однак мій тег був прив’язаний до <a>тегу. Хоча <a>тег нікуди не дінеться, він все-таки зробив подвійне клацання. Я замінив <a>тег на <span>тег, і проблема з подвійним клацанням зникла.

Іншою альтернативою є повністю видалити атрибут href, якщо посилання нікуди не йде.

Я зіткнувся з цим питанням, оскільки мій $(elem).click(function(){});сценарій був розміщений вбудованим файлом у розділ, на який було встановлено style="display:none;".

Коли дисплей css переключився на блок, сценарій додав слухача подій вдруге. Я перемістив сценарій до окремого файлу .js, і слухач дублікатів подій більше не ініціювався.

Коли я використовую цей метод на сторінці завантаження з jquery, я пишу $('#obj').off('click');перед встановленням функції клацання, тому міхур не виникає. Працює для мене.

Моя проста відповідь полягала в тому, щоб перетворити прив'язку клацання у функцію і зателефонувати, що з натискання елемента - спрацювало частування! тоді як нічого з цього не зробили

Якщо ваша подія дзвонить двічі-три або більше, це може допомогти.

Якщо ви використовуєте щось подібне для запуску подій ...

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

… Тоді зверніть увагу на кількість .js-someclassелементів, які ви маєте на сторінці, тому що це спровокує подію натискання для всіх елементів - і не лише один раз!

Просте виправлення - це переконатися, що ви натискаєте клацання лише один раз, вибравши лише перший елемент , наприклад:

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

Зрозуміло, що десь у вашому сценарії (сценаріях) подія "натискання" знову прив'язується до того ж елемента, як і кілька інших відповідей / коментарів.

У мене була подібна проблема, і для того, щоб переконатися, я просто додав console.logкоманду до свого сценарію, як у наступному фрагменті:

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

Якщо натиснувши кнопку, ви отримаєте щось подібне до зображення нижче на консолі розробника вашого браузера (як я це зробив), то ви точно знаєте, що click()подія двічі було прив’язано до однієї і тієї ж кнопки.

Якщо вам потрібен швидкий виправлення, рішення, запропоноване іншими коментаторами щодо використання offметоду (btw unbindзастаріло з часу jQuery 3.0), щоб відключити подію до (повторного) прив'язування, воно добре працює, і я рекомендую також:

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

На жаль, це лише тимчасовий патч! Після того, як проблема із тим, щоб зробити вас шефом щасливою, буде вирішена, вам слід ще трохи зануритися в свій код і виправити проблему "дублювання прив'язки".

Фактичне рішення, звичайно, залежить від конкретного випадку використання. У моєму випадку, наприклад, виникла проблема "контексту". Мою функцію викликали в результаті виклику Ajax, застосованого до певної частини документа: перезавантаження всього документа фактично перезавантажувало і контекст "сторінки", і "елемент", в результаті чого подія була пов'язана з елементом двічі .

Моє рішення цієї проблеми в тому, щоб ефективно використовувати JQuery одну функцію, яка є таким же , як на за винятком , що подія автоматично несвязанное після його першого виклику. Це було ідеально для мого випадку використання, але, знову ж таки, це не може бути рішенням для інших випадків використання.

Була така ж проблема. Це працювало для мене -

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

Сподіваюся, що це комусь допоможе.

У моєму випадку HTML був викладений так:

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

І мій jQuery був таким:

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

Це мене збентежило, бо нічого, здається, не відбувається. Проблема полягала в тому, що внутрішня .shares toggle скасує зовнішню .shares toggle.

Я вирішив цю проблему, змінивши тип елемента. замість кнопки я розміщую дані, і ця проблема більше не виникає.

вкладається:

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

замінити:

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