Question

我使用此脚本自动包装通过锚标记上传的图像，并将图像的源文件添加到href。

问题在于，每次我编辑页面时，它都会再次运行脚本，因此，如果我编辑页面20次，它将添加锚定包裹20次，我只需要运行一次或检测是否已经存在图像的锚定标记换行，而不运行脚本。

    <script>
$('.lightbox img').each(function(){
    $(this).wrap(function() {
      return '<a href="' + $(this).attr('src') + '" />';
    })   
});
</script>

运行脚本后，我运行此脚本以将属性添加到锚标记，如何使这两个脚本仅一个，而第一个脚本仅运行一次。

 <script>
$(".lightbox a").attr("data-toggle", "lightbox");
</script>

Answer 1

由于只需要包装一次，因此只需选择未包装在锚标签中的img标签，例如

$('.lightbox img:not(a>img)').each(function(){
    $(this).wrap(function() {
        return '<a href="' + $(this).attr('src') + '" data-toggle="lightbox" />';
    })   
});

Answer 2

使用布尔值作为全局变量，例如

var flag = true;

现在，在执行之前设置条件，就像

if(flag){  
   $('.lightbox img').each(function(){
       $(this).wrap(function() {
         return '<a href="' + $(this).attr('src') + '" />';
       }) 

   });
  flag=false;    
  }

如何只在锚标签中包装图像一次？

2 个答案: