改变时，点击DIV

我有一个image和div图像源：改变时，点击DIV

<img class="img-responisve pull-left" id="thumb" src="color/40252_mercury_palette_490x437.jpg"/> 
<div class="thumbnail color a" style="background-image:url(color/40292_charcoal_palette_230x128.jpg)"></div>

当我点击div，该image与id="thumb"应更改为相同image即在申报单background刚有点大。以下是我试过，但它不工作：

$(".a").click(function(){ 
    var r1 = $(this).attr("src").replace("230x128.","490x437."); 
    $('#thumb').attr("src", r1); 
});

来源

2015-06-28 Tomas

是在div和id = “大拇指” 的形象有什么不同？ – Michel

$（this）.attr（“src”）没有任何attr src，它指的是div缩略图有一个background-image：url不是src attr –

看看下面的代码

$('div.a').click(function(){ 
 
    $('img.img-responisve').attr("src", $(this).css('background-image').replace('url(','').replace(')','')); 
 
});

img.img-responisve { 
 
    width: 300px; 
 
    height: auto; 
 
    display: block; 
 
    float: left; 
 
    } 
 

 
div.a { 
 
    width: 180px; 
 
    height: 180px; 
 
    background-image: url('http://i.cdn.turner.com/v5cache/CARTOON/site/Images/i80/tj_tom_180x180.png'); 
 
    border: 1px solid #000; 
 
    display: block; 
 
    float: left; 
 
    cursor: pointer; 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<img class="img-responisve pull-left" id="thumb" src="http://img1.wikia.nocookie.net/__cb20150128155039/disney/images/f/f3/Baby_Tom-29.png"/> 
 
<div class="thumbnail color a"></div>

来源

2015-06-28 16:29:29

你应该参考的div background-image：

$("div.a").click(function(){ 
    var r1 = $(this).css("background-image").replace('url(','').replace(')','').replace("230x128.","490x437."); 
    $('#thumb').attr("src", r1); 
});

来源

2015-06-28 16:20:01

为弗雷德里克Nault说，$(this).attr("src")不能得到图像路径，你应该使用.css()

像下面

$(".a").click(function(){ 
    var r1 = $(this).css('background-image').slice(4,-1).replace("230x128.","490x437."); 
    $('#thumb').attr("src", r1); 
});

来源

2015-06-28 16:21:04 Cattla

改变时，点击DIV

回答

相关问题