javascript对象的逐行执行

我想验证一个图像的URL，如果它存在或不使用JavaScript。基本上我想分配的URL为图像，如果它的有效。但是，验证URL的JavaScript函数不是逐行执行，会破坏逻辑并将所有URL返回为true。有什么办法可以保持urlExists函数中的控制权，直到其所有线程都完成为止？javascript对象的逐行执行

当前控件不会等待错误消息的结果，并跳过它以始终返回具有真值的调用函数。任何想法如何使功能保持控制在这里？

function urlExists(testUrl) { 
    var ret = true; 
    var newImage = new Image(); 
    newImage.src = testUrl; 
    $(newImage).error(
     function(){ 
      ret = false; 
     } 
    ); 
    return ret; 
} 
function changeImagePath(obj){ 
    var oldUrl = obj.src; 
    var newUrl = oldUrl.replace("abc","xyz"); 
    if(urlExists(newUrl)){ 
     obj.src = newUrl; 
    } 
} 

<img src="http://sample.com/images/srpr/logo_abc.png" onclick="changeImagePath(this)" />

还意味着我正在处理跨域图像URL。

来源

2015-06-11 Aakash Jain

图像加载是异步的，否则，HTTP请求会阻止主线程，并且网站可能无法响应多个秒。您需要使用回调而不是返回值。您可以在StackOverflow上找到数千个示例。 –

您可以将代码作为回调函数传递以修改现有图像。有没有必要建立一个新的图像进行检查：

function urlExists(img, newUrl, callback) { 
 
    $(img).error(callback).attr('src', newUrl); 
 
} 
 

 
function changeImagePath(obj) { 
 
    var oldUrl = obj.src; 
 
    var newUrl = oldUrl.replace("200", "x"); 
 
    urlExists(obj, newUrl, function() { 
 
    obj.src = oldUrl; 
 
    }); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
 
Click to attempt to change the image 
 
<img src='https://placekitten.com/g/200/300' alt='cat' onclick='changeImagePath(this);'>

正如你可以在浏览器的控制台中看到，一个HTTP请求完成并返回没有找到404。要尝试成功的情况，请将上面示例中的“x”更改为250之类的数字。

来源

2015-06-11 15:16:28

但反正网址分配给图像，无论如果我更改url回错误回调函数的情况下，无效的图像url？ –

@AakashJain我已更新代码并添加了一个工作示例 –

与上述答案有关的查询，如果初始图像无效，则该函数进入回调的无限循环。那么我们如何将它从循环中分离出来呢？ –

javascript对象的逐行执行

回答

相关问题