亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

javascript - How to call the width and height of the read remote image
怪我咯
怪我咯 2017-05-18 10:57:30
0
2
518

I want to call the width and height of this image outside the function. How should I write it?
I've been stuck for three days and have no clue.

    // 更新:
    // 05.27: 1、保證回調(diào)執(zhí)行順序:error > ready > load;2、回調(diào)函數(shù)this指向img本身
    // 04-02: 1、增加圖片完全加載后的回調(diào) 2、提高性能

    /**
     * 圖片頭數(shù)據(jù)加載就緒事件 - 更快獲取圖片尺寸
     *
     * 原理:沒有緩存的情況下,用計時器不斷驗證圖片的大小是否發(fā)生變化,如果不在變化則為ready
     *       如果有緩存則w3c瀏覽器會調(diào)用 complete,ie則會走 onload,都不在走 計時器那部分
     *
     * @version    2011.05.27
     * @author    TangBin
     * @see        http://www.planeart.cn/?p=1121
     * @param    {String}    圖片路徑
     * @param    {Function}    尺寸就緒
     * @param    {Function}    加載完畢 (可選)
     * @param    {Function}    加載錯誤 (可選)
     * @example imgReady('http://www.google.com.hk/intl/zh-CN/images/logo_cn.png', function () {
alert('size ready: width=' + this.width + '; height=' + this.height);
});
     */
    var imgReady = (function () {
        var list = [], intervalId = null,

            // 用來執(zhí)行隊列
            tick = function () {
                var i = 0;
                for (; i < list.length; i++) {
                    list[i].end ? list.splice(i--, 1) : list[i]();
                }
                ;
                !list.length && stop();
            },

            // 停止所有定時器隊列
            stop = function () {
                clearInterval(intervalId);
                intervalId = null;
            };

        return function (url, ready, load, error) {
            var onready, width, height, newWidth, newHeight,
                img = new Image();

            img.src = url;

            // 如果圖片被緩存,則直接返回緩存數(shù)據(jù)
            if (img.complete) {
                ready.call(img);
                load && load.call(img);
                return;
            }
            ;

            width = img.width;
            height = img.height;

            // 加載錯誤后的事件
            img.onerror = function () {
                error && error.call(img);
                onready.end = true;
                img = img.onload = img.onerror = null;
            };

            // 圖片尺寸就緒
            onready = function () {
                newWidth = img.width;
                newHeight = img.height;
                if (newWidth !== width || newHeight !== height ||
                    // 如果圖片已經(jīng)在其他地方加載可使用面積檢測
                    newWidth * newHeight > 1024
                    ) {
                    ready.call(img);
                    onready.end = true;
                }
                ;
            };
            onready();

            // 完全加載完畢的事件
            img.onload = function () {
                 // onload在定時器時間差范圍內(nèi)可能比onready快
                // 這里進行檢查并保證onready優(yōu)先執(zhí)行
                !onready.end && onready();

                load && load.call(img);

                // IE gif動畫會循環(huán)執(zhí)行onload,置空onload即可
                img = img.onload = img.onerror = null;
            };

                // 加入隊列中定期執(zhí)行
            if (!onready.end) {
                list.push(onready);
                // 無論何時只允許出現(xiàn)一個定時器,減少瀏覽器性能損耗
                if (intervalId === null) intervalId = setInterval(tick, 40);
            }
            ;
        };
    })();
    var img_url = 'http://www.planeart.cn/demo/imgReady/vistas24.jpg';
    imgReady(img_url, function () {
        alert(this.width + '\n' + this.height);
        document.getElementById('song').src = img_url;

    })

This kind of pop-up width and height is possible, but how to call this width and height.
Your few codes can save me a lot of time, thank you very much

怪我咯
怪我咯

走同樣的路,發(fā)現(xiàn)不同的人生

reply all(2)
黃舟

Callback

function yourFun(width,height){
    console.log(width,height)
}
var img_url = 'http://www.planeart.cn/demo/imgReady/vistas24.jpg';
    imgReady(img_url, function () {
        yourFun(this.width , this.height);
        document.getElementById('song').src = img_url;

    })

I don’t know if I understand it correctly

過去多啦不再A夢

It seems that this problem cannot be solved. This image reading function is somewhat similar to the asynchronous ajax, and its assignment is executed later

Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template