在jquery中使用'this‘设置图像src

Question

我的超文本标记语言由多个.panorama divs组成，包含图像：

<div id="pan1" class="panorama">
    <img src="images/pano.jpg" alt="">
</div>

<div id="pan2" class="panorama">
    <img src="/images/alma.jpg" alt="">
</div>

我现在使用下面的代码将图像src存储到一个变量

var imgSource = $(this).find(".panorama img").attr("src");

然后将上面的代码放入以下代码中，以读取图像源：

if($('.panorama').length >0 ){
    v1 = pannellum.viewer('pan1', {
    "type": "equirectangular",
    "autoLoad": true,
    "pitch": -20,
    "hfov": 110,
    "panorama": imgSource
});

v2 = pannellum.viewer('pan2', {
    "type": "equirectangular",
    "autoLoad": true,
    "pitch": -20,
    "hfov": 110,
    "panorama": imgSource
});
}

但是，这只是返回两次images/pano.jpg并忽略pannellum.org/images/alma.jpg

我的$(this)设置有误吗？

Answer 1

假设您想要所有的图像(因为您实际上没有在这个上下文中指定this是什么)。

你不需要$(this).find(".panorama img")，你只想使用没有this的搜索词

var img = $(".panorama img");

这将返回您的图像(复数)。您返回了多个图像，因此需要迭代源：

​

$(document).ready(function() {
   var img = $('.panorama img');

  for(x = 0; x<img.length; x++)
  {
     var imgSource = $(img[x]).attr("src");
     console.log(imgSource);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="pan1" class="panorama">
    <img src="images/pano.jpg" alt="">
</div>

<div id="pan2" class="panorama">
    <img src="/images/alma.jpg" alt="">
</div>

​