onclick函数报错‘找不到变量：函数名’及跳转失效问题排查求助

嘿，我帮你梳理了代码里的问题，找到几个导致点击时出现「找不到变量：函数名」错误的核心原因，一起来解决：

1. 异步脚本加载让函数“赶不上”点击事件 #

你在引入JS文件时加了async属性：

<script src="shop.js" async></script>

async的作用是让浏览器异步加载脚本——也就是说页面在解析HTML的同时，后台偷偷加载JS。如果用户在JS还没加载完的时候点击了触发函数的元素，这时候对应的函数还没被定义，自然就会报错“找不到变量”。这就是为什么只有部分函数偶尔失效，不是全挂的原因（取决于脚本加载的速度）。

修复方案二选一： #

• 简单粗暴版：直接去掉async属性，让脚本按顺序加载，确保页面所有元素可用时，函数已经定义好了：

  <script src="shop.js"></script>
  

• 优雅进阶版：如果不想让JS阻塞页面加载，就把所有内联的onclick换成事件监听，并且等DOM加载完成后再绑定。比如在shop.js末尾加这段代码：

  document.addEventListener('DOMContentLoaded', function() {
      // 处理T-Shirts链接
      document.querySelector('a[href="#"][onclick="tshirt();"]').addEventListener('click', function(e) {
          e.preventDefault(); // 阻止默认跳转
          tshirt();
      });
      // 处理所有Capas de telemovel链接
      document.querySelectorAll('a[href="#"][onclick="capasmovel();"]').forEach(link => {
          link.addEventListener('click', function(e) {
              e.preventDefault();
              capasmovel();
          });
      });
      // 处理宇航员手机壳的点击
      document.querySelector('.product_name[onclick="astronaut_capa();"]').addEventListener('click', astronaut_capa);
      
      // 记得把HTML里的onclick属性删掉，避免冲突
  });
  

2. 函数名拼写不一致（针对你提到的astronautcapa） #

你说HTML里调用的是astronautcapa，但JS里定义的是astronaut_capa——如果确实存在这种拼写错误（比如某个HTML元素里写了onclick="astronautcapa();"），那肯定找不到函数。

修复方案： #

全局检查所有HTML里的内联onclick函数名，确保和JS里的定义完全一致：比如JS里是astronaut_capa，HTML里就必须写onclick="astronaut_capa();"，不能丢了下划线。

额外提几个小问题（不影响当前报错，但会坑后续功能） #

顺便看到JS里还有几处语法错误，提前修复避免踩坑：

• addToCartButtons的事件监听写错了：应该是'click'事件，而且不能加括号（加括号会直接执行函数，不是绑定）：

  // 错误写法
  button.addEventListener('clicked',addToCartClicked())
  // 正确写法
  button.addEventListener('click', addToCartClicked)
  

• getSize函数里用了赋值=而不是比较===，而且size = xs里的xs是未定义变量，应该取元素的文本：

  function getSize() {
      var size = "";
      if (document.getElementById('xs').className === "clicked_size_button") {
          size = document.getElementById('xs').innerText;
      }
      // 其他size判断同理修改
      return size;
  }
  

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