Question

我想在jquery中获取imagesize，我有这个代码。它起到了

的作用

alert (v);

我想知道当 v 实际包含值时，其余部分出了什么问题。

 var v = $('#xxx input').val();
    alert (v);
    var newImg = new Image();
    newImg.src = v;
    var height = newImg.height;
    var width = newImg.width;
    alert ('The image size is '+width+'*'+height);

由于让

Answer 1

获取图像大小的代码并不总是有效。图像异步加载，因此高度和宽度不会立即可用。您需要以下内容：

var newImg = new Image();
var height, width;

newImg.onload = function() {
    height = newImg.height;
    width = newImg.width;
    window.alert('The image size is '+width+'*'+height);
};

newImg.src = v;

Answer 2

假设#xxx是您的输入容器ID，您的代码应该有效：

<div id="xxx" align="center">
    <input name="test" value="/images/image1.jpg" />
</div>

Chrome更新

<script type="text/javascript">
    var newImg = new Image();
    $(function() {
        var v = $('#xxx input').val();
        alert(v);
        newImg.src = v;
        setTimeout(function() {
            var height = newImg.height;
            var width = newImg.width;
            alert ('The image size is '+width+'*'+height);
        }, 1000);
    });
</script>

Answer 3

当您提醒图像时，是否收到图像的正确网址？

我的第一个想法是将第一行更改为：

var v = $('#xxx').val();

目前，您正在选择中的输入元素“xxx”，但您希望具有 ID“xxx”的元素

编辑：另一个想法：

var v = $('#xxx input').val();
document.body.appendChild((function() {
    var newImg = document.createElement("img");
    newImg.src = v;
    newImg.id = "newImg";
    return newImg;
})());

var height = $("#newImg").attr("height");
var width = $("#newImg").attr("width");
alert('The image size is '+width+'*'+height);

Answer 4

您需要等待图片加载！

var v = $('#xxx input').val();
alert (v);
var newImg = new Image();
newImg.onload = function() {
  var height = this.height;
  var width = this.width;
  alert ('The image size is '+width+'*'+height);
}
newImg.src = v;

编辑：将src作业移至最后。

在jQuery中获取图像大小

4 个答案: