Question

**更新，仍然试图解决这个问题，但仍在努力。任何帮助，将不胜感激。谢谢。 **

我有一个包含图像的HREF：

<a href="#" class="small-gallery">
    <img src="001.jpg">
</a>

单击此图像时，会出现一个弹出模式（Bootstrap），并使用与HREF内部显示的图像相同的图像填充模态体（即模态的内容）。即：

$('.thumbnail').click(function(e){
  e.preventDefault();
  $($(this).parents('.small-gallery').html()).appendTo('.modal-body');
  $('#myModal').modal({show:true});
});

这一切都很好，但我真正想做的是更改出现在模态体中的图像SRC，以便它从图像中获取SRC（即.001.jpg）并添加一串“-m” “在图像扩展之前，它将图像SRC更改为”001-m.jpg“

所以事件的顺序是：

点击.small-gallery href
从.small-gallery img
在.modal-body中输出完整图片代码但确保图片SRC在.jpg扩展名之前有“-m”

我确信这很简单，但我有一个心灵转储，无法让它发挥作用。

感谢您提前帮助，祝圣诞快乐！

Answer 1

在另一个论坛的帮助下解决了这个问题......

不是拆分字符串，而是在数据属性中提供新的源代码，然后抓住它。

e.g。

<a href="#" class="small-gallery">
    <img data-img-modal="001-m.jpg" class="thumbnail" src="001.jpg">
</a>

JS

$('.thumbnail').click(function(e){
  e.preventDefault();
  var myClone = $(this).closest('.small-gallery').clone();
  var theImg =  myClone.find('img');
  var newSrc = $(this).data('img-modal'); 
  theImg.removeClass('thumbnail').attr("src", newSrc);
  myClone.appendTo('.modal-body');
 $('#myModal').modal({show:true});
});

修改图像SRC并附加到Div

1 个答案: