Question

我有一个图片库，当其中一个达到700px高度时，它将被切断并附加一个这样的标签：Click to see image

我正在使用此代码：

<script type="text/javascript">
                jQuery(document).ready(function($){
                    $(".div-img").each(function() {
                      var maxHeight = 699;
                      var imgHeight = $(this).height();
                      if ( imgHeight > maxHeight) {
                      $(this).append('<a href="<?php the_permalink();?>" data-evt="EntryLongPost" class="view-full-content view-content external-link fa-external-link-square">View Full Content<span class="crop"></span></a>').find(".cropping-a").css({'max-height':'500px', 'overflow':'hidden', 'display': 'block'});  
                      }
                      });
                  });
              </script>

代码正在运行，因为每次正确添加锚标签，但href属性为符合条件的所有图像采用相同的链接，我读过这是因为php代码在服务器端，所以它只运行一次，这就是为什么它只抓取第一个图像的链接。我已经尝试了一个函数，隐藏了锚标记，然后从js代码块中看到它但是没有工作，尝试将代码放在functions.php文件中但不工作。

Answer 1

您可以像使用jQuery一样抓取图像的来源：

<script type="text/javascript">
    jQuery(document).ready(function($){
        $(".div-img").each(function() {
            var maxHeight = 699;
            var imgHeight = $(this).height();
            var href = $(this).attr('src');
            if ( imgHeight > maxHeight) {
                $(this).append('<a href="' + href + '" data-evt="EntryLongPost" class="view-full-content view-content external-link fa-external-link-square">View Full Content<span class="crop"></span></a>').find(".cropping-a").css({'max-height':'500px', 'overflow':'hidden', 'display': 'block'});  
            }
        });
    });
</script>

如何使用jquery附加锚标记，其中包含永久链接？

1 个答案: