0

夕方、<td>タグとその<p>中にタグがあり、両方にonclickイベントがあるという問題があります。これは、 onclickが独自ではなく<p>onclickを実行しているという教科書的な状況です。<td>ここや他の場所で調査したことから、これは泡立ちが原因であることがわかりました。ただし、この問題の修正を実装する方法が見つからないように見えるため、明らかに知っていることは戦いの半分にすぎません。これが私が現在それを回避しようとしている方法です

html:

<table>
    <tr>
        <td>
            <p>text</p>
        </td>
    </tr>
</table>

jquery:

$(function(){
var show = function(){
    $('#editentry').css({'display': 'block'}); //this is column 3
}
//run var show on click
$('td p').click(function(event){
    show;
    event.stopPropagation();//stop bubbling
});
});//end function

私もこれを試しました：

$(function(){
var show = function(event){
    $('#editentry').css({'display': 'block'}); //this is column 3
    event.stopPropagation();
}
//run var show on click
     $('td p').click(show);
});//end function

私が理解していることから、これはうまくいくはずです。簡単なことを見逃していたらごめんなさい。jqueryに少し慣れていないので、これは複雑なテーマのようです。前もって感謝します ：）

4

2 に答える 2

2

あなたが持っているものはうまくいくはずです。それはまさにあなたが使用する方法ですstopPropagation。

イベントのバブリングを停止する方法を示す例を次に示します。

HTML:

<table>
  <tr>
    <td>
        <p>inside paragraph</p> outside paragraph
    </td>
  </tr>
</table>

Javascript:

$(function(){

  $('td').click(function(event){
    alert('cell');
  });
  $('td p').click(function(event){
    event.stopPropagation();
    alert('paragraph');
  });
});

デモ: http://jsfiddle.net/39n5X/

「段落の内側」をクリックすると、「段落」メッセージのみが表示され、「段落の外側」をクリックすると、代わりに「セル」メッセージが表示されます。

于 2013-03-09T00:47:19.863 に答える
0

Try replacing your stop bubbling line with this:

event.preventDefault ? event.preventDefault() : (event.returnValue=false);
event.stopPropagation ? event.stopPropagation() : (event.cancelBubble=true);
于 2013-03-09T00:34:59.027 に答える