Question

如果此问题已存在，请帮助我将其标记为重复原因，因为我找不到相似的解决方案。

虽然有多个方法调用onclick属性，例如：

<a onclick="foo();afterFoo();afterAfterFoo();"/>

我想在afterFoo()满足某些条件时停止后续的呼叫，例如afterAfterFoo();，foo()。

我在方法return false;中尝试了foo()，但是它仍然调用其他方法。我记得这个技巧曾经按预期工作。

Answer 1

这种情况不会发生。您需要创建一个包装函数并将其附加为onClick处理程序，而不是直接从中调用这3个函数。您可以根据if条件从包装函数中调用3个函数。

<a onclick="clickHandler();"/>
function clickHandler() {
    foo() && afterFoo() && afterAfterFoo();
}

Answer 2

您可以简单地通过使用if条件来做到这一点：

function foo() {
  console.log('foo')
  return true;
}

function afterFoo() {
  console.log('afterFoo')
  return false;
}

function afterAfterFoo() {
  console.log('afterAfterFoo')
  return true;
}

function specialSequence() {
  if (foo())
    if (afterFoo())
      afterAfterFoo();
}

<a onclick="specialSequence();">Click Me</a>

那么这里发生了什么：我们正在呼叫specialSequence。它运行foo，如果返回true，则继续执行下一个序列函数afterFoo，如果返回true，则继续执行afterAfterFoo。但是它返回false，这意味着在运行afterFoo之后，函数specialSequence将停止运行。

在您声明每个函数有多个参数并且您不希望specialSequence拥有其使用的所有函数的参数总和之后，您可以像这样在html中使用它（简单地将函数复制到onClick）

function foo() {
  console.log('foo')
  return true;
}

function afterFoo() {
  console.log('afterFoo')
  return false;
}

function afterAfterFoo() {
  console.log('afterAfterFoo')
  return true;
}

<a onclick="if (foo())
    if (afterFoo())
      afterAfterFoo();">Click Me</a>

停止后续的onclick方法调用

2 个答案: