JQuery 获取图像 src

我希望当我单击这个按钮时，可以得到特定的 img src 并在 div 类 img-block块中显示 img src。

超文本标示语言

<button class="button">Click</button>
<div class="img1">
<img src="img.jpg" alt="">
</div>


<div class="img-block"></div>

CSS

.img-block{
position: absolute;
top:10%;
right:10%;
background-color: red;
width: 500px;
height: 500px;
}
.img1 img{
width: 200px;
}

JS

$('.button').click(function(){
var images = $('.img1 img').attr(src);
alert(images);
});

但是现在我面临的问题是如何得到 img src。
所以我使用警报来进行测试，结果是它什么警报都没有。

392479 次浏览
小开
最佳答案

Src 应该加引号:

$('.img1 img').attr('src');
小开

你可以找到类似的

$('.class').find('tag').attr('src');
小开

这就是你需要的

 $('img').context.currentSrc
小开

为充分使用网址

$('#imageContainerId').prop('src')

相对图像网址使用

$('#imageContainerId').attr('src')


function showImgUrl(){
console.log('for full image url ' + $('#imageId').prop('src') );
console.log('for relative image url ' + $('#imageId').attr('src'));
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img id='imageId' src='images/image1.jpg' height='50px' width='50px'/>


<input type='button' onclick='showImgUrl()' value='click to see the url of the img' />

小开

在我的案例中，这种格式适用于最新版本的 jQuery:

$('img#post_image_preview').src;
小开

当处理 HTMLDOM 时(即。(this) ，必须使用数组选择器 [0]从 Javascript 数组中检索 jQuery 元素。

$(this)[0].getAttribute('src');
小开

Html:

<img id="img_path_" width="24" height="24" src=".." class="img-fluid" alt=“">

约翰逊:

$('#img_path_').attr('src')
小开 
jQuery(document).ready(function($){
$('body').on('click','.button',function(){
var imgsrc=$('.img1 img').attr('src');
$(".img-block").append(imgsrc);
})
});

提交答案