为何return false无法终止JavaScript函数执行？

嘿，这是异步操作的典型坑！你的verifyImageURL里的图片加载是异步执行的，也就是说，当你在change事件处理函数里调用它之后，代码不会等着onload或onerror回调触发，而是直接往下跑，执行后面的AJAX请求——所以哪怕回调里返回false，也根本拦不住已经启动的AJAX。

问题根源拆解 #

img.onload和img.onerror属于异步事件，它们的触发时机是在图片加载完成/失败后，而此时你的change事件函数早就执行到AJAX那一步了，回调里的return false根本影响不到前面已经执行的代码。

方案1：把AJAX逻辑塞进回调里（快速修复） #

最直接的办法就是把AJAX请求放到verifyImageURL的回调函数中，只有当验证通过时才执行：

function verifyImageURL(url, callBack) {
  var img = new Image();
  img.src = url;
  img.onload = function () {
    callBack(true);
  };
  img.onerror = function () {
    callBack(false);
  };
}

$('input#id_imageURL').on('change', function(e) {
  var url = $(this).val();
  console.log(url, typeof url); // 这里修正了你原来的url['type']，应该是typeof url哦
  
  verifyImageURL(url, function(isValid) {
    if (!isValid) {
      console.log('图片URL无效，终止操作');
      return; // 这里return就会阻止后续AJAX执行
    }
    
    // 只有验证通过才执行AJAX
    $.ajax({
      url: '你的接口地址',
      method: 'POST',
      data: { imageURL: url },
      success: function(res) {
        // 处理请求成功的逻辑
      },
      error: function(err) {
        // 处理请求失败的逻辑
      }
    });
  });
});

方案2：用Promise+async/await优化（更优雅的现代写法） #

如果你的项目支持ES6+语法，推荐把verifyImageURL封装成Promise，配合async/await让异步代码看起来像同步代码，可读性拉满：

function verifyImageURL(url) {
  return new Promise((resolve) => {
    const img = new Image();
    // 如果是跨域图片，需要添加这个属性（前提是目标服务器允许跨域）
    img.crossOrigin = 'anonymous';
    img.src = url;
    img.onload = () => resolve(true);
    img.onerror = () => resolve(false);
  });
}

$('input#id_imageURL').on('change', async function(e) {
  const url = $(this).val();
  console.log(url, typeof url);
  
  // 等待图片验证结果
  const isValid = await verifyImageURL(url);
  if (!isValid) {
    console.log('图片URL无效，终止操作');
    return; // 直接终止函数，不执行后续AJAX
  }
  
  // 验证通过，执行AJAX
  $.ajax({
    url: '你的接口地址',
    method: 'POST',
    data: { imageURL: url },
    success: function(res) {
      // 处理成功逻辑
    }
  });
});

额外提醒 #

如果你的图片URL是跨域的，记得给Image实例添加img.crossOrigin = 'anonymous'，同时确保目标图片服务器配置了CORS允许你的域名访问，否则可能会出现验证误判的情况。

内容的提问来源于stack exchange，提问作者Zorgan