2

コードには、jQueryを使用して実装した折りたたみ可能なセグメントがいくつかあります。

このような：

<h2 class="expand">Link1</h2>
                <div class="collapse">
                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore 
                    et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip 
                    ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore 
                    eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa 
                    qui officia deserunt mollit anim id est laborum.</p>                
                    <p class="top"><a href="#content">Top of page</a></p>
                </div>

上記のコードのように、さらにいくつかの同一のセクションがあります。

クリックしたときに、これらの各見出しのIDを取得したいと思います。たとえば、「Link1」をクリックすると、そのIDがポップアップ表示されます。

ポップアップにIDを表示する関数はすでに定義しています。ここにあります ：

 $(document).ready(function () {
        $("a").click(function (event) {
          alert(event.target.id);
        });
  });

アプリケーションを実行して（たとえば）「Link1」をクリックするたびに、空白の出力が表示されます。すべてのリンクに対して個別のクラスを宣言することはオプションのようですが、それ以外の方法で宣言したいと思います。これらの要素のIDを取得する方法について誰かが代替案を提案できますか？

4

2 に答える 2

6

提供されたマークアップは、これらの要素にIDを指定していないことを示しています。次のように、IDを付けてみてください。

<a id="contentLink" href="#content">Top of page</a>

次に、次のことができます。

 $(document).ready(function () {
    $("a").click(function (event) {
        alert($(this).attr("id"));
    });
 });

編集：または、「ID」と言うとき、実際にはhrefを意味する場合（マークアップにはhref属性があるため）、次のことができます。

$(document).ready(function () {
    $("a").click(function (event) {
        alert($(this).attr("href"));
    });
 });
于 2012-05-08T11:24:56.140 に答える
2

まず、thisハンドラーがバインドされている要素を意味する場合は、使用する必要があります。このことを考慮：

<a href="#content" id="a"><span id="b">foo</span></a>

a要素にハンドラーがバインドされている場合は、this.idbeaにevent.target.idなりますb。という意味 でない限りevent.target、 を使用してthisください。

第 2 に、id 値は継承されません (実際、一意でなければならないため、継承されていても意味がありません)。a要素に値を与えるかid、ドキュメントをトラバースして関連する要素を見つけてその を取得する必要がありますid。

次のようなコードでこれを行うことができます。

$(this).closest('div').prev().attr('id')

ただし、h2 タグには実際には がないidため、指定する必要があります。そのタグのテキストを取得する場合は、次を使用しますtext。

$(this).closest('div').prev().text()
于 2012-05-08T11:28:26.717 に答える