4

.on要素の直接の子にのみイベントをバインドするために使用しようとしています。

ドームは次のようになります。

table > tbody > tr+ > td > table > tbody > tr+

これまでのところ、私は試しました：

  • table.find(">tbody").on("dbclick", ">tr", listenerFunction);
  • table.on("dbclick", "> tbody > tr", listenerFunction);

これらはどれも期待どおりに機能せず、使用table.on("dbclick", "tr", listenerFunction)するとネストされたテーブルと衝突し、両方のテーブルにこのリスナーがあるため、二重トリガーなどが発生します。

どんなアイデアでも大歓迎です。

<table>
  <tbody>
   <tr><!--Selectable row, adds the row after with sub table --></tr>
    <tr>
      <td>
        <table>
          <tbody>
            <tr></tr>
          </tbody>
        </table>
      </td>
    </tr>
  </tbody>
</table>
4

5 に答える 5

6

リスナー関数で使用event.stopPropagationして、親へのイベントのバブリングを停止しtrます。

function listenerFunc(e) {
    e.stopPropagation();

    // Do your thing...
}
于 2013-08-06T10:23:26.820 に答える
2

私の提案は、idまたはclassを子テーブルに追加することです。これにより、ページ上の他の要素や将来発生する変更と競合しないことが保証されます。nested-table子テーブルにクラスを追加するとします。コードは次のようになります。

$('table.nested-table tr').dblclick(listenerFunc)

テーブルを参照することを示したように、これは機能するはずです：

table.on('dblclick', 'tr', listenerFunc)

于 2013-08-06T10:37:00.837 に答える
0

最初の<table>もの自体がネストされていない場合は、他の要素<tr>の子孫ではない要素のみに一致するセレクターを提供できます。<tr>

table.on("dbclick", "tr:not(tr tr)", listenerFunction);
于 2013-08-06T10:25:30.880 に答える