0

私はjqueryサイクルを使用していますが、jqueryイベントが機能しないことを除いて正常に動作します。

私は基本的にキャプション付きの画像を循環させ、「alt」属性でキャプションを設定します。

特定の画像では、モーダルを呼び出し、クラスを画像に割り当て、jquery にモーダルを生成させます。これは正常に機能します。

キャプション内にリンクも追加します。そこにリンクが表示されますが、リンクをクリックするとjqueryが起動しません。

これは、このキャプションとリンク付きの画像です。

<img class="openModal" src="images/video.jpg" alt="<div class='wrap'><h1 class='caption-title'>Video</h1><p class='caption-desc'>Aliquam lectus orc ac.<a class='button' class='openModal'>watch the video</a></p></div>"/>

alt タグには、モーダルを呼び出すクラスを持つアンカーが含まれています。

<a class='button' class='openModal'>watch the video</a>

ここにjqueryがあります

   $('.openModal').on('click', function (e) {
    console.log('this is the click');
    e.preventDefault();
});

サイクルは正常に動作します。

画像をクリックすると、モーダルが開きます-完璧です。

キャプション内のこのリンクをクリックしても何も起こりません。

ここで何が欠けていますか？

4

1 に答える 1

0

おそらく、HTML がページに挿入される前にイベントをバインドしているためです。

これを試して：

$('.cycleOrCaptionContainer').on('click', '.openModal', function(e) {
    console.log('this is the click');
    e.preventDefault();
});

'.cycleOrCaptionContainer'コードの実行後にこの要素を追加しても'click'、 class を持つ子要素から をリッスンします。.openModal

于 2013-04-12T01:44:06.433 に答える