动态加载jQuery及自定义JS后全局调用函数报错的解决问询

嘿，我帮你梳理下这个问题的核心原因和解决办法：

核心原因：eval的作用域问题 #

你在$.post的匿名回调函数里直接使用eval(response)，在非严格模式下，直接调用eval会把函数定义在当前回调函数的局部作用域内，而不是全局作用域。这就导致回调外部的代码（比如somefunc）无法访问这些函数——哪怕你等待异步完成，这些函数也只存在于回调的局部作用域里，全局上下文根本看不到它们。

你说在回调内部能访问到这些函数，正好印证了这一点：回调内部是局部作用域，能拿到eval定义的函数，但外部的全局作用域拿不到。

快速解决方案：强制eval在全局作用域执行 #

把回调里的eval(response)改成间接调用eval，比如通过window.eval，这样代码会在全局作用域执行，所有自定义函数都会挂载到window对象上，外部就能直接访问了：

$.post('/ajax.php?action=js', { 'action': 'custom' }, function (response) {
  // 用window.eval强制在全局作用域执行代码
  window.eval(response);
});

修改后，当你在somefunc里调用custom1()时，实际上是在调用window.custom1()，就能正常访问了。

更安全规范的替代方案：避免eval，用动态script标签加载 #

eval存在安全风险（如果响应内容被篡改，可能执行恶意代码），更推荐用动态创建script标签的方式加载JS文件，这也是浏览器原生支持的规范做法，还能自动把函数挂载到全局作用域：

1. 加载jQuery的改进版 #

function loadScript(url, callback) {
  const script = document.createElement('script');
  script.src = url;
  script.onload = callback;
  document.head.appendChild(script);
}

// 先加载jQuery
loadScript('/ajax.php?action=js&action=jquery', function() {
  // jQuery加载完成后，加载自定义JS
  loadScript('/ajax.php?action=js&action=custom', function() {
    // 这里可以确认所有函数都已加载完成
    console.log('自定义函数加载完毕');
  });
});

2. 调整后端输出 #

注意：如果用script标签加载，后端/ajax.php?action=custom需要直接输出JS代码（不要包裹其他内容），并且响应头的Content-Type要设为application/javascript，这样浏览器会自动解析执行，函数会直接成为全局变量。

补充说明 #

你提到已经通过setTimeout等待变量可见，其实只要解决了作用域问题，等待逻辑依然有效——现在函数会挂载到window上，你可以在somefunc里检查window.custom1是否存在，直到存在再调用：

function somefunc() {
  // 检查custom1是否已定义
  if (typeof window.custom1 === 'function') {
    custom1();
  } else {
    // 等待100ms后重试
    setTimeout(somefunc, 100);
  }
}

这样就能确保在函数加载完成后再调用，避免“未定义”的错误。

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