如何在jQuery/Javascript中获取点击触发函数的返回值？是否可行？

嘿，这个问题我之前踩过坑，明确说：完全可以获取点击事件触发函数的返回值，只是你之前的方法没抓对要点～

先说说你之前方法无效的原因 #

你提到把外部函数存入变量，然后在onclick监听器里用变量名，大概是这样的写法吧？

function myClickFunc() {
  return "test value";
}
const funcVar = myClickFunc;
btn.onclick = funcVar;

这种写法只是把函数绑定为点击事件的处理程序，但浏览器执行这个函数时，不会自动帮你捕获返回值——你得主动在回调逻辑里去调用函数并接收它的返回值才行。

同步函数的返回值获取 #

如果你的点击触发函数是同步的（没有异步操作比如setTimeout、fetch），直接在事件监听的回调里调用函数并接收结果就好：

// 定义你的点击处理函数
function handleButtonClick() {
  // 这里可以是任何同步逻辑
  return `点击时间：${new Date().toLocaleTimeString()}`;
}

// 绑定点击事件并获取返回值
const myButton = document.getElementById("myBtn");
myButton.addEventListener("click", function() {
  // 在这里调用函数并接收返回值
  const clickResult = handleButtonClick();
  console.log("拿到的返回值：", clickResult);
  // 你可以用这个值做任何事，比如更新DOM
  document.getElementById("result").textContent = clickResult;
});

异步函数的返回值获取 #

如果你的点击函数包含异步操作，直接return拿不到结果，得用Promise配合async/await来处理：

// 带异步操作的点击函数
async function fetchDataOnClick() {
  // 模拟接口请求之类的异步操作
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve("异步请求返回的数据");
    }, 1500);
  });
}

// 绑定事件并处理异步返回值
const asyncBtn = document.getElementById("asyncBtn");
asyncBtn.addEventListener("click", async function() {
  try {
    // 用await等待异步函数的结果
    const asyncResult = await fetchDataOnClick();
    console.log("异步返回值：", asyncResult);
  } catch (error) {
    // 处理可能的错误
    console.error("获取异步返回值失败：", error);
  }
});

总结一下核心逻辑 #

不管是同步还是异步场景，关键都是在事件监听的回调函数内部，主动调用目标函数并捕获它的返回值——而不是单纯把函数绑定给事件就完事。这样你就能轻松拿到你想要的返回值啦～

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