Как динамически найти атрибуты HTML-ссылки с помощью Jquery и токенизировать атрибут ref через запятую?

Question

Представьте, что у меня есть список имен фруктов, которые динамически заполняются, и коды, сгенерированные php, выглядят следующим образом:

<div id="fruit_list">
  <ol>
    <li>Apple <a id='1' ref='red'>Delete</a></li>
    <li>Pear <a href id='2' ref='green'>Delete</a></li>
  </ol>
</div>

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

Можете ли вы предложить подход, если я ошибаюсь?

Answer 1

Попробуйте:

$('#fruit_list a').bind('click', function (evt) {
  console.log(
    /*the element id*/
    $(this).attr('id'),

    /*the element attribute ref, splitted by ,*/
    $(this).attr('ref').split(/,/)
  );
});

Answer 2

Не слышал об атрибуте ref.И вы не должны придумывать свои собственные.Вы можете использовать атрибут данных для него (data-ref = value).

Или вы можете сделать это следующим образом http://jsfiddle.net/gmrcn/6/

HTML

<div id="fruit_list">
  <ol>
    <li>Apple <a href="#1" class="delete" id='red'>Delete</a></li>
    <li>Pear <a href="#2" class="delete" id='green'>Delete</a></li>
  </ol>
</div>

JS

$('a.delete').click( function() {
    //get fruitname and id
    var fruit = $(this).attr('id');
    var id = $(this).attr('href').replace("#","");

    //send with ajax, to your serverscript
    $.post('yourdeletescript.php', {id:id, fruit:fruit} , function(data) {
         //remove LI of the deleted 
         $('#'+fruit).parent().remove();
    });

    //disable default link action
    return false;
});

Answer 3

Я не совсем понимаю, что именно вы спрашиваете. Но я бы реализовал функцию удаления следующим образом.

$('div#fruit_list ol li a').click(function(){ //adding click event to all delete links
  var id = $(this).attr('id'); //getting value of id attribute of the clicked link
  var ref= $(this).attr('ref');//getting value of ref attribute of the clicked link
  $.post('/script',{id:id, ref:ref},function(){ // send id and ref to delete script
    $('#'+id).parent().remove();//remove the corresponding li on success
  });
})