Имам div, който се зарежда динамично след извикване на AJAX повикване чрез .html атрибут
$("#gallery").html(imagesHtml);
insdie imagesHtml i ave 2 бутона, наречени "prebtn" и "nxtbtn", сега се опитвам да свържа тези бутони със следния синтаксис в JQuery:
$("#gallery").bind("click", "#nxtbtn", function() {
alert("next");
});
и
$("#gallery").bind("click", "#prebtn", function() {
alert("previous");
});
но ако натискам един от бутоните, двата събития се задействат и той показва allert за "next" и "previous"; howevr Имам кликнете само един от бутоните!
Моля, уведомете ме, ако се нуждаете от повече разяснения.
Благодаря
Отговори:
3 за отговор № 1Вие обърквате bind
и on
методи. Изглеждат подобни, но bind
има по-малко функционалност: не поддържа делегиране на събития. Вторият аргумент не е селектора за делегираните събития, но data
аргумент.
Това ще работи:
$("#gallery").on("click", "#nxtbtn", function() {
0 за отговор № 2
Мисля, че сте решили да го използвате .on()
вместо:
$("#gallery").on("click", "#nxtbtn", function() {
alert("next");
});
$("#gallery").on("click", "#prebtn", function() {
alert("previous");
});
Най- bind()
Функцията ще се свърже с елемента в началния селектор, в този случай #gallery
, Така че вие обвързвате двете функции с това събитие. Технически това е и какво .on()
прави, но използва втория аргумент като филтър за елемента, който е задействал събитието. Не мисля .bind()
прави това, мисля, че вторият аргумент е само данни, които вашите функции за обработване на събития игнорират.
0 за отговор № 3
трябва да използвате за вместо да ги използвате свързват за да работи върху динамично създадени елементи. докато e.preventDefault () ще предотврати задействането по подразбиране на съответното събитие.
$("#gallery").on("click", "#nxtbtn", function(e) {
e.preventDefault();
alert("next");
});
и
$("#gallery").on("click", "#prebtn", function(e) {
e.preventDefault();
alert("previous");
});