получение идентификатора по нажатым элементам с помощью jquery

Question

У меня есть серия значков Удалить, которые отображаются следующим образом:

echo '<img id="'.$items['id'].'" src="images/delete.png" />'; 

Где $items['id'] - ссылка на идентификатор элемента БД, который я хотел бы удалить для этого значка.

Как я могу получить доступ к этому идентификатору в jquery при нажатии на элемент, чтобы я мог затем вызвать:

$.get('ajax/delete.php', { id: $('#id').val() },      
function(data) {}

Или что-то в этом роде.

Answer 1

Следующий код поможет вам. Добавьте класс «delete» к каждому вашему img.

$('.delete').onclick(function() {
    var id = $(this).attr('id');
    $.post('ajax/delete.php', { id: id } function(data) {

     ...
    });
});

Answer 2

Я бы лично пошел на угон и постепенную деградацию, обернув с . Кроме того, вам, скорее всего, не следует выполнять операции удаления / удаления с помощью GET. Но вот, пожалуйста;

$('img[src=images/delete.png]').click(function(e) {
  $.get('ajax/delete.php', { id: this.id }, function() {
    // complete, perhaps get rid of the <img> now?
  });

  return false;
});

Answer 3

Я бы справился с этим немного по-другому. Я бы хотел, чтобы каждый значок удаления сопровождался скрытым вводом, который содержит значение элемента, соответствующее идентификатору элемента, который нужно удалить. Затем я бы использовал jQuery для извлечения атрибута значения скрытого поля. Таким образом, вам не нужно будет манипулировать магическими строками, чтобы использовать числовые идентификаторы.

Кроме того, никогда использует запрос get для удаления. Все, что нужно сделать, это ввести URL в правильном формате с надлежащими учетными данными, чтобы обойти любую обработку на стороне клиента, которую вы добавили для проверки вашего удаления. AJAX позволяет вам отправлять другие типы запросов, и вы должны предпочесть POST или DELETE запрос для удалений.

echo '<img class="deleteIcon" src="images/delete.png" />';
echo '<input type="hidden" value="' + $item[id] + '" />';

$('.deleteIcon').click( function() {
     var id = $(this).next('input[type=hidden]').attr('value');
     $.ajax({
          url: 'ajax/delete.php',
          type: 'delete',
          data: { id: id },
          dataType: 'json', // get back status of request in JSON
          success: function(data) {
                if (data.status) {
                   // remove row, or whatever
                }
                else {
                   // handle deletion error
                },
          ... other parameters/callbacks ...
     });
});

Answer 4

$("#imageID").click ( function () {
    alert ( $(this).attr ( "id" ) );
});

если у вас есть имя класса

$(".yourclassname").click ( function () {
    alert ( $(this).attr ( "id" ) );
});