jQueryのトリガーは、（）私は私のウェブサイトでライトボックスを使用していた

Question

$(function(){ 
 
     $('.parent-class h3').click(function(){ 
 
     $(this).siblings('p').find('a').trigger("click"); 
 
     //var h = $(this).siblings('p').find('a').attr("href"); 
 
     //alert(h); 
 
     }); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 

 
<div class="parent-class"> 
 
    <p class="child-class"> 
 
     <a href="hello.jpg" data-rel="lightbox-1">Lightbox Image</a> 
 
    </p> 
 
    <h3>Title Here</h3> 
 
</div>

を働いていません。 h3タグをクリックしてライトボックスを表示したい。私は警告がありますa href（コメント行）これは正常に動作しています。しかし、作業トリガーではありません。私のコードの上を見てください。私のコードでなぜtrigger('click')が動作しないのかを教えてください。

編集あなた

をありがとう - ライトボックスを忘れてしまいました。単純なアンカーリンクは機能しません。

Answer 1

これにあなたのjavascriptのコードを変更し

：何のクリックイベントが要素にバインドされていないので、jQueryのトリガーが動作しません

$(function(){ 
     $('.parent-class h3').click(function(){ 
     $(this).siblings('p').find('a')[0].click(); 
     }); 
}); 

、これはjavascriptのクリック機能で、これマウスのような実際のクリックをシミュレート！

Answer 2

$(function(){ 
 
     $('.parent-class h3').click(function(){ 
 
     //$(this).siblings('p').find('a').trigger("click"); 
 
     var h = $(this).siblings('p').find('a').attr("href"); 
 
     location.href = h; 
 
     }); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div class="parent-class"> 
 
    <p class="child-class"> 
 
     <a href="hello.jpg" data-rel="lightbox-1">Lightbox Image</a> 
 
    </p> 
 
    <h3>Title Here</h3> 
 
</div>

Answer 3

ダイレクトクリック機能を使用できます。

$(function(){ 
 
     $('.parent-class h3').click(function(){ 
 
     $(this).siblings('p').find('a').click() 
 
     //var h = $(this).siblings('p').find('a').attr("href"); 
 
     //alert(h); 
 
     }); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 

 
<div class="parent-class"> 
 
    <p class="child-class"> 
 
     <a href="hello.jpg" data-rel="lightbox-1">Lightbox Image</a> 
 
    </p> 
 
    <h3>Title Here</h3> 
 
</div>

Answer 4

あなたがアンカーにイベントを割り当てていないので、それがトリガされていない理由はあります。私が付けたスニペットを試してみてください。私はあなたのコードが動作してクリックイベント

$(function(){ 
 
     $('.parent-class h3').click(function(){ 
 
     $(this).siblings('p').find('a').trigger("click"); 
 
     //var h = $(this).siblings('p').find('a').attr("href"); 
 
     //alert(h); 
 
     }); 
 
     $("a").click(function(){ 
 
     alert('hi') 
 
     }) 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 

 
<div class="parent-class"> 
 
    <p class="child-class"> 
 
     <a href="hello.jpg" data-rel="lightbox-1">Lightbox Image</a> 
 
    </p> 
 
    <h3>Title Here</h3> 
 
</div>