jQuery関数をonclickリンクで呼び出す方法は？

Question

私は、ユーザーがページをリロードせずにリストから項目を削除できるようにしたいと思います。これを行うにはjQuery/AJAXを使用しています。しかし、私の現在のコードではdivは削除されていません。私は正しくトラバースしていると思うので、問題が何であるかはわかりません。

ここでは例を参照してください：http://jsfiddle.net/BbpWc/1/

HTML：

<img src="delete.png" onclick="delete_item(<? echo $row_item['id'] ?>);"> 

Javascriptを：

$(document).ready(function() { 
    delete_item=function(item_id){ 
     var confirmation = confirm('Are you sure you want to remove this item?'); 
     if (confirmation){ 
      $.post(
       "../../items.php?id="+item_id+"&i=delete" 
      ) 
      $(this).parent('.item_container').remove(); 
     }    
     else { 
      return false;  
     } 

    }; 
}) 

Answer 1

は、このバイオリンを見てください：http://jsfiddle.net/BbpWc/9/

私が持っている：

• は、現在のコンテキストで
• 削除IDをまたがるためにアンカーを変更し、あなたがでIDを持っている必要はありません。それ。
• のonclick属性を削除し、あなたは `$（）を使用する必要があります

Answer 2

あなたはparent()へお電話の上に括弧が欠落し、DOMノードに渡していませんでした（jQueryセレクタの冒頭にある$(this)）をトラバースしていたので、更新されたjQuery：

$(document).ready(function() { 
    delete_item = function(item_id,that) { 
     var confirmation = confirm('Are you sure you want to remove this item?'); 
     if (confirmation) { 
      //$.post("../../items.php?id=" + item_id + "&i=delete") 
      $(that).parent().prev().remove(); 
     } 
     else { 
      return false; 
     } 

    }; 
}); 

そしてHTML：今動作しているよう

<div class="item_container"> 
    Item 1 
</div> 
<div> 
    <a href="#" onclick="delete_item(1,this);">Delete 1</a> 
</div> 

<div class="item_container"> 
    Item 2 
</div> 
<div> 
    <a href="#" onclick="delete_item(2,this);">Delete 2</a> 
</div> 

<div class="item_container"> 
    Item 3 
</div> 
<div> 
    <a href="#" onclick="delete_item(3,this);">Delete 3</a> 
</div> 

：JS Fiddle demo。代わりに、侵入のインラインイベントハンドラの、jQueryのclick()イベントを使用するを編集

---

：

$('a').click(
    function(){ 
     var i = $(this).index('a') + 1; 
     delete_item(i,$(this)); 
    }); 

JS Fiddle demo。それを注意することはを編集

---

は、時々、物事は予想より少し楽になります

$('a').click(
    function(){ 
     $(this).parent().prev('div.item_container').remove().end().remove(); 
    }); 

JS Fiddle demo。の使用に関する

---

（下記）@ ROXONさんのコメントに反応してにを編集...確かに、それはどこかにライブラリファイルで生活機能のように簡単に再利用可能ではありません、が

andSelf()方法：

$('a').click(
    function(){ 
     $(this).parent().prev('div.item_container').andSelf().remove(); 
    }); 

JS Fiddle demo。