0

次のようなリンクでもある画像のリストがあります。

<a href="#"><img alt="P1010104" class="uploaded_image" src="/assets/user_images/156/thumb/P1010104.jpg?1335332807" /></a>

<a href="#"><img alt="P1010104" class="uploaded_image" src="/assets/user_images/157/thumb/P1010105.jpg?1335332809" /></a>

1 つの画像がクリックされたときに画像をページに追加する JavaScript があります。

//add an image from the gallery to the mail later
  $('.uploaded_image').click(function(){
      alert('clicked');
      var src=$(this).attr('src').replace("thumb", "medium");
      var location = $('#user_image_location').attr('value');
      $('#mailing_body').contents().find("[data-edit-img="+''+location+''+"]").attr('src', src);
      $('[data-dismiss]="cancel"').click();
});

ajax を使用して別の画像を画像リストに追加します。ただし、この新しく追加された画像をクリックすると、JavaScript が起動しません。

これどうやってするの？

ありがとう

4

3 に答える 3

3

jqueryon()を使用します。

$(document).on('click', '.uploaded_image', function(){
      alert('clicked');
      var src=$(this).attr('src').replace("thumb", "medium");
      var location = $('#user_image_location').attr('value');
      $('#mailing_body').contents().find("[data-edit-img="+''+location+''+"]").attr('src', src);
      $('[data-dismiss]="cancel"').click();
});

jquery 1.7+

于 2012-04-25T06:13:58.617 に答える
1

使用する必要があります.on()

$('.uploaded_image').on('click', function(){
      alert('clicked');
      var src=$(this).attr('src').replace("thumb", "medium");
      var location = $('#user_image_location').attr('value');
      $('#mailing_body').contents().find("[data-edit-img="+''+location+''+"]").attr('src', src);
      $('[data-dismiss]="cancel"').click();
});

.click()は機能しません。これは、.click ハンドラーが登録されているときに要素が DOM にないためです。

1.7未満のjQueryバージョンを使用している場合は、.bind()代わりに使用する必要があります.on()

ドキュメンテーション：

于 2012-04-25T06:16:13.110 に答える
0

Jquery は通常、動的に読み込まれたコンテンツをサポートしません。

以前は .live() を使用する必要がありました。現在は廃止されており、.on() Handler を使用することになっています。

構文：

.on( events [, selector] [, data] , handler(eventObject) ) ;

あなたのコード（適応。テストされていません）：

$('.uploaded_image').on("click", function(){
      alert('clicked');
      var src=$(this).attr('src').replace("thumb", "medium");
      var location = $('#user_image_location').attr('value');
      $('#mailing_body').contents().find("[data-edit-img="+''+location+''+"]").attr('src', src);
      $('[data-dismiss]="cancel"').click();
});

.on() の詳細については、Jquery API を参照してください。

于 2012-04-25T06:36:22.553 に答える