1

Jquery1.7.2を使用しています。

ページ内の任意のhtml要素にマウスオーバーしてJqueryを使用して、特定の属性（id）までHtml要素を横断したいと思います。

親（）関数がありますが、問題はid属性を持つ親要素で停止を選択する方法です

$("*", document.body).click(function (e) {
  e.stopPropagation();
  var domEl = $(this).get(0);      
      var parentEls = $(domEl).parents()
        .map(function () { 
              return this.tagName; 
            })
        .get().join(", ");

$（ "b"）。append（ " " + parentEls + " "）; }）;

これはコードですが、ルートまですべての要素を取得していますが、タグに属性IDを持つクローゼット要素で停止したい

私を助けてください 。

4

2 に答える 2

3

最も近いを使用するだけです：

$(this).closest('#the-id');

id 属性を持つ最も近いものを探しているだけでない限り、次のようになります。

$(this).closest('[id]');

編集:更新された質問を見た後、これはあなたが望むものになるはずです:

$(document).click(function(e) {
    e.preventDefault();
    var parents = $(e.target).parentsUntil('[id]')
        .map(function() { return this.tagName; }).get().join(',');
    console.log(parents);
});

このアプローチは、クリック イベントを選択して DOM 内のすべてのノードにバインドすることなく、目的を達成することに注意してください。これはかなり手間のかかるアプローチです。

編集（再度）： id 属性を持つタグを含めたいと思われるようです（上記の解決策はすべてですが、そのタグは含まれていません）。これを行うには、ソリューションは非常に似ています。

$(document).click(function(e) {
    e.preventDefault();
    var $parents = $(e.target).parentsUntil('[id]');
    var tagNames = $parents.add($parents.parent())
        .map(function() { return this.tagName; }).get().join(',');
    console.log(tagNames);
});
于 2012-05-10T16:17:50.157 に答える
1

クリックされた要素からドキュメントルートまでの階層をマップしたいようです。その場合、parents（）をevent.targetに適用できます。

$(document).click(function(e) {
    e.preventDefault();
    var parentEls = $(e.target).parents().map(function() { 
        return this.tagName; 
    }).get().join(", ");
});

jmar777として、セレクターも変更する必要があることに注意してください。すべて"*"の要素にイベントハンドラーを追加しますが、これはおそらく必要なものではありません。イベントバブリングを利用するには、代わりに単一のハンドラーをにバインドします。document

于 2012-05-10T16:26:32.283 に答える