Блог

Представьте, что у меня есть список динамически заполняемых названий фруктов, а коды, сгенерированные 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, где, когда пользователь нажимает на ссылку «Удалить», в разделе fruit_list и при нажатии на ссылку «Удалить» я хочу знать идентификатор атрибутов и ссылку ссылки, на которую нажата ссылка. Зная атрибуты, как я могу разбить его в jQuery, чтобы ссылка могла быть разделена запятой.

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

Попробуйте:

 $('#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(/,/)
  );
});
  

Не слышал об атрибуте ref. И вы не должны создавать свои собственные. Вы могли бы использовать для этого атрибут data (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;
});
  

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

 $('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
  });
})