获取图片的自身宽高后并追加在URL后面然后传值给后台

最新推荐文章于 2022-03-27 22:53:37 发布

IT牛男_Edward

最新推荐文章于 2022-03-27 22:53:37 发布

阅读量495

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/weixin_41760500/article/details/80934690

本文介绍了一种在上传图片前动态获取并追加图片尺寸信息的方法。通过JavaScript操作DOM，实现图片宽度和高度的自动读取，并将其作为参数附加在图片URL后，最终将这些信息格式化为后台所需的字符串格式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

//获取图片的自身宽高后并追加在URL后面然后传值给后台格式为："jijh.png，wjfiejw.png,wjfiejw.png"
//首先定义两个全局变量naturalWidth和naturalHeight ; 当点击发布照片的时候先获取到每张照片的宽高，然后赋值; 最后把pictures传给后台

// 获取图片宽、高传值，
var naturalWidth=[],     //获取到的宽
   naturalHeight=[];           //获取到的高
   function getPicter(){
       $('.insertImg').each(function(index){
           naturalWidth[index] = $(this)[0].naturalWidth;
            naturalHeight[index] = $(this)[0].naturalHeight;
       })

   }
    var data={}
    var imgs = [];
//   在每个img标签的src路劲后面追加宽/高
   $(".save-photo ul li .insertImg").each(function(index){
       imgs.push($(this).attr("src")+"?"+"w"+"="+naturalWidth[index]+"&"+"h"+"="+naturalHeight[index]);
   })
//   后台所需参数为：pictures     格式为："jijh.png，wjfiejw.png,wjfiejw.png"
   data.pictures = imgs.join("，");