Uncaught ReferenceError: xxx is not defined

Question

写了一个函数，在页面中引用，加载图片的时候调用这个函数。函数生效了，但是在控制台有显示报错。
把那个函数单独拿出来做个demo的时候，也不报错，但是和其他的js代码放在一起就一直报错，不知道什么原因。希望有懂的大神们指点一下。
Uncaught ReferenceError: AutoResizeImage is not defined

代码如下
js
//图片等比缩放

function AutoResizeImage(maxWidth, maxHeight, objImg) {

    var img = new Image();
    img.src = objImg.src;
    var hRatio;
    var wRatio;
    var Ratio = 1;
    var w = img.width;
    var h = img.height;
    wRatio = maxWidth / w;
    hRatio = maxHeight / h;
    if (maxWidth == 0 && maxHeight == 0) {
        Ratio = 1;
    } else if (maxWidth == 0) {//
        if (hRatio < 1) Ratio = hRatio;
    } else if (maxHeight == 0) {
        if (wRatio < 1) Ratio = wRatio;
    } else if (wRatio < 1 || hRatio < 1) {
        Ratio = (wRatio <= hRatio ? wRatio : hRatio);
    }
    if (Ratio < 1) {
        w = w * Ratio;
        h = h * Ratio;
    }
    objImg.height = h;
    objImg.width = w;
}

html

<center><img onerror="this.src='/Content/images/nopic.jpg'" data-src="@BuildEffectImage(effectImage, 0, 625)" src="@ConfigHelper.CdnPrefix/Content/images/NewHome/white.png" class="coverimage" height="625" onload="AutoResizeImage(830, 0, this);"  /></center>

报错图片

Answer 1

可能是js加载的顺序有错
把这个js放在调用之前加载

js的加载涉及到先后加载的问题
如果后面是直接调用执行的，就需要在调用执行之前加载
如果是等页面加载完成才待用执行，js放在那里加载都没有问题
js的加载是根据页面代码的先后顺序加载的，页面加载是从上到下的加载的

当浏览器遇到（内嵌）<script>标签时，当前浏览器无从获知javaScript是否会修改页面内容。因此，这时浏览器会停止处理页面，先执行javaScript代码，然后再继续解析和渲染页面。同样的情况也发生在使用 src 属性加在javaScript的过程中（即外链 javaScript），浏览器必须先花时间下载外链文件中的代码，然后解析并执行它。在这个过程中，页面渲染和用户交互完全被阻塞了。

也就是说：每当浏览器解析到<script>标签（无论内嵌还是外链）时，浏览器会（一根筋地）优先下载、解析并执行该标签中的javaScript代码，而阻塞了其后所有页面内容的下载和渲染。