无法设置按钮onclick属性，代码无报错但不生效求助

你遇到的问题核心在于JavaScript中给元素onclick赋值的方式错误——你用了字符串形式的函数调用语句，但JS里的onclick属性需要接收的是函数引用，而非字符串。这也是为什么你的catch块没捕获到错误：赋值字符串本身不是语法错误，错误只会在按钮点击、JS尝试解析执行这个字符串时才会触发，而这个时机不在你当前的try/catch范围内。

修正后的基础写法 #

直接把函数本身赋值给onclick（注意不要加括号和引号，加括号会立即执行函数并把返回值赋值给onclick，这不是你想要的）：

var nextButton = document.getElementById("next");
try{
 if(tvalue == "trend"){
 nextButton.onclick = generateLocations;
 } else if (tvalue == "stats"){
 nextButton.onclick = generateCategories;
 }
} catch(err) {
 document.getElementById("demo").innerHTML = err.message;
}

更推荐的写法：使用addEventListener #

这种方式比直接赋值onclick更灵活，支持绑定多个相同类型的事件，还能更清晰地管理事件监听：

var nextButton = document.getElementById("next");
try{
 // 先移除可能存在的旧监听，避免重复绑定同一事件
 nextButton.removeEventListener('click', generateLocations);
 nextButton.removeEventListener('click', generateCategories);

 if(tvalue == "trend"){
 nextButton.addEventListener('click', generateLocations);
 } else if (tvalue == "stats"){
 nextButton.addEventListener('click', generateCategories);
 }
} catch(err) {
 document.getElementById("demo").innerHTML = err.message;
}

关于错误捕获的补充 #

如果想捕获点击事件执行时的错误，需要把错误捕获逻辑放到事件处理函数内部：

function generateLocations() {
  try {
    // 这里写你的generateLocations原有逻辑
  } catch(err) {
    document.getElementById("demo").innerHTML = err.message;
  }
}

function generateCategories() {
  try {
    // 这里写你的generateCategories原有逻辑
  } catch(err) {
    document.getElementById("demo").innerHTML = err.message;
  }
}

这样就能在函数执行出错时，正确捕获并显示错误信息了。

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