87,910
社区成员
发帖
与我相关
我的任务
分享jq 获取图片的高和宽度
<img alt="" style="display:none" id="displayimg"/>$("#displayimg").attr("src", src);
$("#displayimg").height();
$("#displayimg").width();
获取的宽度和高度都为0，请问这是为什么?
...全文
请发表友善的回复…
发表回复
写个程序换个饼 2020-04-09
- 打赏
- 举报
1、图片加载、DOM渲染需要时间
2、display===none的DOM节点无高宽
初心不变时过迁 2020-04-08
- 打赏
- 举报
如果在想为什么为0 你打断点看看img1的值就知道了
初心不变时过迁 2020-04-08
- 打赏
- 举报
我手上没JQ 所以用js写了个
JQ的你看着改
JQ的你看着改
<script type="text/javascript">
function getcontent(){
var img1 = document.getElementById('mm');
document.getElementById('text1').value=img1.clientWidth;
document.getElementById('text2').value=img1.clientHeight;
debugger;
}
</script>
<body>
<div id="app">
</div>
<button onClick="getcontent()">按钮</button>
宽度：<input id="text1" class="vv" type="text" value="" />
高度：<input id="text2" class="vv" type="text" value="" /><img src="./img/123.png" title="11" id="mm" />
<!-- built files will be auto injected -->
</body>
E次奥 2020-04-08
- 打赏
- 举报
load是异步执行的，所以外边先输出了；
jnzsk 2020-04-08
- 打赏
- 举报
var src="xxxx.jpg";
var height_v, width_v;
$("#displayimg").attr("src", src);
$("#displayimg").on("load", function () {
height_v = $("#displayimg").height() / 2;
width_v = $("#displayimg").width() / 2;
});
console.log(height_v);
console.log(width_v);
height_v和width_v 都为“undefined”！请问是什么原因？
_念_ 2020-04-08
- 打赏
- 举报
$("#displayimg").attr("src", src);
$("#displayimg").on("load", function() {
$("#displayimg").height();
$("#displayimg").width();
})
liu_lei 2020-04-08
- 打赏
- 举报
