jquery - 通过jQuery获取点击的图像src并放入另一个图像src

Question

我需要从下面单击的 HTML 图像中获取源 src URL:

$(document).ready(function() {
  $(".thumbnail").click(function() {
    var var1 = $(this).find('.thumbnail img').attr('src');
    console.log(var1);
    $('#main_image').attr('src', var1).load(function() {});
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span class="thumbnail">
<img src="http://www.euroe-com.com/agv/graphics/agv_0041A2HY-002_b.jpg" width="200">
<img src="http://www.euroe-com.com/agv/graphics/agv_0041A2HY-006_b.jpg" width="200">
<span>

<br /><br /><br />
Put inside this 
<img id="main_image" src="http://www.euroe-com.com/agv/graphics/added-desc/agv_0041A2HY-02211_415x500.jpg" width="400">

我尝试了您所发布的 jQuery 代码。

由于某种原因，它会抛出未定义。

这是在行动http://jsfiddle.net/1oaxue9h

Answer 1

出于某种原因，即使提供了Tidy按钮，人们也懒于整理他们的代码。

Learn jQuery 。您需要删除.thumbnail从选择器开始工作。因为，你已经在这里了，由 this 表示。 。自 this是 .thumbnail ，只是 find("img")就够了。

var var1 = $(this).attr('src');

您还有一个未关闭的<span> ，需要修改为</span> .

$(document).ready(function() {
  $(".thumbnail img").click(function() {
    var var1 = $(this).attr('src');
    console.log(var1);
    $('#main_image').attr('src', var1).load(function() {});
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span class="thumbnail">
  <img src="http://www.euroe-com.com/agv/graphics/agv_0041A2HY-002_b.jpg" width="200">
  <img src="http://www.euroe-com.com/agv/graphics/agv_0041A2HY-006_b.jpg" width="200">
</span>

<br /><br /><br />
Put inside this 
<img id="main_image" src="http://www.euroe-com.com/agv/graphics/added-desc/agv_0041A2HY-02211_415x500.jpg" width="400">