event.preventDefault対event.stopPropagation

Question

event.preventDefault()とevent.stopPropagation()の違いを教えてもらえますか？

私はテーブルを持っており、そのテーブルの中にimgタグがあります。

imgタグをクリックすると、ポップアップが表示されます。

しかし、私はまた、複数の行の選択を停止したいので、私が使用します。

$("table.items tbody tr").click(function(event) { 
     event.stopPropagation(); 
    }); 

私はjsのコードを使用すると、ポップアップが表示されません。

jsコードを削除すると、ポップアップが機能します。

$(".info").live("click",function(e){ 
    //console.log('ok'); 
    e.stopPropagation(); 
    var elem = $(this); 
    var id = $(this).attr("id").replace("image_","container_"); 
    $('#'+id).toggle(100, function() { 
     if($(this).css('display') == 'block') { 
      $.ajax({ 
       url: "$url", 
       data: { document_id:elem.attr('document_id') }, 
       success: function (data) { 
        $('#'+id).html(data); 
       } 
      }); 
      } 
     }); 
}); 

なぜですか？

Answer 1

私は、私の知る限りではJavascriptの専門家ではないですけど：

stopPropagationは、イベントがチェーンアップバブルのないことを確認するために使用されます。例えば。 <td>タグをクリックすると、親の<tr>のクリックイベントが発生し、その親の<table>などが表示されます。stopPropagationは、これが発生しないようにします。

preventDefaultは、要素の通常の動作を停止するために使用されます。リンク上のクリックハンドラ内のpreventDefaultは、リンクのフォローを停止するか、送信ボタンをクリックするとフォームが送信されなくなります。

Answer 2

イベントpreventDefault From W3C:

event.preventDefault（）メソッドが起こってから 要素のデフォルト動作を停止させます。たとえば ：

防止URL

イベントstopPropagation From W3C次の形式が からリンクを防ぐ提出から送信ボタンを：

するevent.stopPropagation（）メソッドは、のバブリングを停止親イベントハンドラが から実行されないように、 親エレメントへのイベント。

Answer 3

• stopPropagation子の子にイベントを停止しますが、それだろう子に 親（全体の祖先）
• preventDefaultに起きてからそのイベントを停止します 親の（および先祖も）

あなたのコードは親ですか？それは子供ですか？imgは子供ですtrは親です（正直に言うとおじいちゃんです）。stopPropagationコードはどこにあるのでしょうか。