首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >使用javascript过滤输出图像链接

使用javascript过滤输出图像链接
EN

Stack Overflow用户
提问于 2013-06-08 05:10:02
回答 2查看 156关注 0票数 0

我正在使用prettyPhoto lightbox和wordpress

我需要的wordpress画廊缩略图150px显示,而不是默认的prettyPhoto缩略图(他们使用大图像作为缩略图)

这是创建缩略图的代码

代码语言:javascript
复制
for (var i=0; i < pp_images.length; i++) {
    if(!pp_images[i].match(/\b(jpg|jpeg|png|gif)\b/gi)){
        classname = 'default';
        img_src = '';
    }else{
        classname = '';
        img_src = pp_images[i];
    }
    toInject += "<li class='"+classname+"'><a href='#'><img src='" + img_src + "' width='75' height='75' alt='' /></a></li>";
};

这是图像链接的输出

代码语言:javascript
复制
<img src="http://127.0.0.1/wordpress/photopname1.jpg" width="75" height="75" alt="">
<img src="http://127.0.0.1/wordpress/photopname2.gif" width="75" height="75" alt="">
<img src="http://127.0.0.1/wordpress/photopname3.png" width="75" height="75" alt="">

我需要这样的输出

代码语言:javascript
复制
<img src="http://127.0.0.1/wordpress/photopname1-150x150.jpg" width="75" height="75" alt="">
<img src="http://127.0.0.1/wordpress/photopname2-150x150.gif" width="75" height="75" alt="">
<img src="http://127.0.0.1/wordpress/photopname3-150x150.png" width="75" height="75" alt="">

在图像扩展名"-150x150“之前添加

谢谢您:)

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2013-06-08 05:28:06

处理多个.的解决方案

代码语言:javascript
复制
var size = '-150x150';



for (var i=0; i < pp_images.length; i++) {
  if(!pp_images[i].match(/\b(jpg|jpeg|png|gif)\b/gi)){
      classname = 'default';
      img_src = '';
  }else{
      classname = '';
      img_src = pp_images[i];
  }

  //ex: img_src = a.b.png
  var src = img_src.split('.'); //ex: ['a', 'b', 'png']
  src[src.length - 2] = src[src.length - 2] + size; //ex: ['a', 'b-150x150', 'png']
  src = src.join('.');//a.b-150x150.png

  toInject += "<li class='"+classname+"'><a href='#'><img src='" 
           + src + "' width='75' height='75' alt='' /></a></li>";
};
票数 2
EN

Stack Overflow用户

发布于 2013-06-08 05:16:25

如果我没理解错的话,你只需要这样:

代码语言:javascript
复制
 toInject += "<li class='"+classname+"'><a href='#'><img src='" + img_src.split(".").join("-150x150.") + "' width='75' height='75' alt='' /></a></li>";

问题编辑后的更新:您是否可以在末尾添加完整路径,如下所示:

代码语言:javascript
复制
 toInject += "<li class='"+classname+"'><a href='#'><img src='http://127.0.0.1/wordpress/" + img_src.split(".").join("-150x150.") + "' width='75' height='75' alt='' /></a></li>";

或者您已经获得了具有完整路径的pp_images数组?

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/16993001

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档