Question

function find_image_dm(imgsrc){
    window.imgwidth = ""; 
    var img = new Image();

    img.onload = function test() {
        var width = this.width;
        var height = this.height;

        if (height > 300) {
            var x = height/300;
            window.imgwidth = Math.ceil(width/x);
        }
    }

    img.src = imgsrc;

    return(window.imgwidth);
}

我想返回window.imgwidth，所以我可以在其他地方使用它但是如果我尝试提醒它或类似的东西它显示为空白。我如何返回其价值。 window.imgwidth是我尝试创建一个全局变量。我不需要窗口的宽度

Answer 1

您尝试的问题是 onload回调异步执行。因此，由于return回调在将来某个时间执行，因此无法可靠onload。考虑将回调函数参数传递给find_image_dm函数，而不是考虑返回值：

function find_image_dm(imgsrc, callback)
{
    var img = new Image();

    img.onload = function()
    {
        callback(this.width, this.height);
    };

    img.src = imgsrc;
}

您可以这样使用：

function onReturnSize(w, h)
{
    console.log('image width is', w);
    console.log('image height is', h);
}

find_image_dm('http://placekitten.com/2200/1200', onReturnSize);

演示：http://jsfiddle.net/mattball/pTKW4/

Answer 2

我认为问题是当你执行find_img_dm时，你试图立即返回宽度值。这不起作用，因为在函数完成执行之前很可能不会触发img.onload。

您需要做的是在onload事件处理程序中，调用另一个函数，传入宽度值，并让该函数执行加载图像时需要执行的操作。然后您将知道在那时，图像被加载并且宽度值可用。

Answer 3

好的，试试吧。您必须在函数test：

中返回window.imgwidth的值

function find_image_dm(imgsrc){
    window.imgwidth = ""; 
    var img = new Image();
        img.onload = function test() {
        var width =this.width
        var height= this.height;
           if(height > 300){
               var x = height/300;
               console.log(Math.ceil(width/x));
               window.imgwidth = Math.ceil(width/x);
               console.log(window.imgwidth);
               alert (window.imgwidth);
               return window.imgwidth;
           }
        }

        img.src = imgsrc;
}

Answer 4

确定。另一个问题是@Tom。

我可以从这里看到两个问题。

如果您的 if语句返回false，则不会计算window.imgwidth，因为这似乎是您计算它的唯一位置。
window.imgwidth正在function test()中计算，但未返回。

Answer 5

查看代码似乎问题是，在尝试获取高度之前，您在技术上并未加载图像，因为您在src调用之后设置了onload。

如果你正在使用jQuery，你应该尝试利用它。

function find_image(imgsrc) {

    var imgWidth,
        img = $('<img/>').attr('src', imgsrc).load(function() {

        var $img = $(this),
            height = $img.height(),
            width = $img.width();

        if (height > 300) {
            var x = height/300;
            imgWidth = Math.ceil(width/x);
        }

    });

    return imgWidth;

}

Answer 6

好的......我查看了您的代码，发现您的脚本存在问题。您正在使用image.onload函数，因此当您加载图像源时，图像加载然后只有维度可用并存储在window.imgwidth上。

一切顺利，但问题是，当你调用函数时，加载u图像需要时间，所以如果你试图获取window.imgwidth，因为资源仍在加载你不会得到window.imgwidth 。返回值也不起作用，因为代码不会等到图像加载，所以尽管图像正在加载，代码块执行将完成，因此你不会在window.imgwidth中有任何数据。

如果在完成图像加载后的某段时间内尝试提醒window.imgwidth，则可以看到window.imgwidth具有该值。并且你有if块，只有当高度超过300但你没有其他块时才将数据存储在window.imgwidth中，所以你需要实现它作为后备:)。

如果我说的很难，请告诉我:-D

javascript的问题并返回一个值

6 个答案:

演示：http://jsfiddle.net/mattball/pTKW4/