Почему мой обработчик jQuery-кликов работает несколько раз для некоторых своих целей?
Я применяю:
$(".newContentLink").click(function() {
$("#test").append("1");
});
В этом:
<span id="contents">
<input class="newContentLink" type="submit" style="width: 100%;" value="CREATE A NEW CONTENT"/>
<span id="content1" class="content study">
</span>
<input class="newContentLink" type="submit" style="width: 100%;" value="CREATE A NEW CONTENT"/>
<span id="content3" class="content study">
</span>
<input class="newContentLink" type="submit" style="width: 100%;" value="CREATE A NEW CONTENT"/>
<span id="content4" class="content category">
</span>
<input class="newContentLink" type="submit" style="width: 100%;" value="CREATE A NEW CONTENT"/>
</span>
Как получилось?
когда я нажимаю на первые 2 кнопки, он добавляет 111,
следующая кнопка добавляет 11,
и последний добавляет 1?
Ответы
Ответ 1
Невозможно выполнить репликацию. Я подозреваю, что вы неверно представляете. упрощение, в основном — ваша ситуация. Если быть точным, я считаю, что вы динамически добавляете эти входы и вызываете $(".newContentLink").click(...)
каждый раз — который, естественно, продолжает применять дополнительные копии обработчика кликов к каждому .newContentLink
на странице.
Таким образом, самый последний вход, который вы создали, имеет одну копию обработчика кликов и добавляет один 1
. Второй самый последний имеет две копии и добавляет 11
. Третий имеет три и добавляет 111
и т.д.
Чтобы предотвратить это, примените обработчик кликов к вновь созданному элементу DOM, а не $(".newContentLink")
(что всегда означает каждый .newContentLink
).
Ответ 2
или вы можете отменить событие click каждый раз, когда вы добавляете новый элемент
$('.newContentLink').unbind('click');
$(".newContentLink").click(function() {
$("#test").append("1");
});
Ответ 3
Как хаос говорит, вы, вероятно, называете click()
каждый раз, когда вы добавляете его, и они накапливаются.
Если вы добавляете эти элементы в документ динамически и должны убедиться, что эта функция добавлена к каждому добавленному, как об использовании live?
$('#contents').on('click', '.newContentLink', function() {
$("#test").append("1");
});
Это позволит убедиться, что правило динамически применяется один раз к любому квалификационному классу в документе.
Ответ 4
Не ошибка jQuery - Рабочий демонстрационный пример
В вашем коде должна быть проблема с чем-то другим. Где элемент с id="test"
в вашей разметке?
EDIT:
Просто прочитайте ответ хаоса, который звучит как правдоподобное объяснение.
Кстати, идентификаторы элементов должны быть уникальными в HTML-разметке - это часть спецификации HTML и может быть еще одним возможным объяснением
Ответ 5
Чтобы убедиться, что функция выполняется только один раз при событии с одним щелчком
вы можете использовать $( ". newContentLink" ). one();
$(".newContentLink").one(function() {
$("#test").append("1");
});
Ответ 6
Попробуйте присвоить разные имена элементам ввода.
Ответ 7
У меня была аналогичная проблема... Выяснилось, что я применяю функцию изменения в цикле... т.е. мой предыдущий код был...
$("table#UserIRTable > tbody > tr").each(function()
{
..............
..............
$("input[id='thisMonthSupply']").change(function(e){
......
});
..........
..........
}
взял функцию изменения и бинго... он работал.....