6

img1ID 、、img2...、 。を持つHTMLの画像のクラスがありますimg9。ID 、、...でリンク（HTMLaタグ）を作成したいので、リンクをクリックするたびに対応する画像が表示されます。link_img1link_img2link_img9

すべてのリンクを同じクラスに割り当ててから、そのクラスのJQueryクリックリスナーを追加し、リスナー内でそのリンクのIDを探して、対応する画像を表示することを考えています。クラスのJQueryリスナーを追加するにはどうすればよいですか？また、要素からIDを取得するにはどうすればよいですか？

4

5 に答える 5

10

タグの ID を使用aしてターゲットを定義しないでください。href代わりに属性を使用することをお勧めします。

<img id="img1" ...>
<img id="img2" ...>
<a href="#img1" class="image-link">Click me</a>
<a href="#img2" class="image-link">Click me</a>

jQuery("a.image-link").click(function(){
  $(this.href).show();
});

これにより、同じ画像に 2 つのリンクを設定できます。

于 2013-03-16T18:22:30.573 に答える
3

試す：

$('a.yourClassName').click(function(){
   $('img#'+ this.id).show();         
});
于 2013-03-16T18:33:19.010 に答える
2

クラスのリスナーを追加するには、jQuery の方法 (つまり、$('elem.class') で選択します。次に、attr() を使用して ID を取得します。

于 2013-03-16T18:22:22.633 に答える
2

ここ。他のいくつかの回答で述べたように、idあなたが取るべき行動を決定するための最良の方法ではないでしょう. 必要に応じて別の属性を使用してください

$('a.some-class').click(function() {
    switch (this.id) {
        case 'one':
          // do something
          break;
        case 'two':
          // do something
          break;
        default:
          // do something
          break;
    }
});
于 2013-03-16T18:22:54.497 に答える
1

これを試して

$('a.yourClass').click(function(){
    var $linkID= $(this).attr('id'); 
    $('img#'+ $linkID).show();         
});
于 2013-03-16T18:24:03.623 に答える