Как получить атрибуты селектора при использовании on () или bind ()?

У меня есть веб-страница, на которой перечислены некоторые статьи из базы данных. Контент загружается динамически через ajax.

Каждая статья имеет кнопку редактирования, которая динамически вызывает редактор (второй вызов ajax), где пользователь может вносить исправления в статью.

Моя проблема заключается в том, что мне нужно передать «id» статьи, когда кнопка редактирования нажата (чтобы загрузить ее в окно редактора), но потому что мне нужно использовать bind (), чтобы кнопки работали, нет способ получить любой атрибут кнопки (селектор), например, ‘href’:

$('body').on ('click', '.button', function (){
//load editor window
});

Так как же я могу ссылаться здесь на ‘.button’, чтобы получить его атрибуты, используя, например, .attr ().

Спасибо!

1

Решение

Вам нужно будет использовать e.preventDefault(); чтобы убедиться, что вы не запускаете событие по умолчанию, которое будет URL в вашем href тег.

$('body').on ('click', '.button', function (e){
e.preventDefault();
console.log($(this).attr('href'));
});
1

Другие решения

Я предполагаю, что ваш HTML отображается так:

<div id="article_1">
<button class="button">Edit</button>
</div>
<div id="article_2">
<button class="button">Edit</button>
</div>
<div id="article_3">
<button class="button">Edit</button>
</div>

Если это так, то ваш JS должен быть таким:

$('body').on('click', '.button', function () {
var id = $(this).parent().attr("id");
alert(id);
});
0