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>

我有一些 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()处理程序。

句法:

.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 回答