Question

我有这种类型的代码：

<button onclick="fn1();fn2();fn3()">Clic</button>

我在fn1中测试一下，如果是真的，我不想要调用fn2和fn3。我在fn1中使用了event.stopPropagation（）（以跨浏览器的方式将事件传递给函数）但是其他函数仍被调用。

有人可以帮忙吗？

Answer 1

这不是一个好习惯，但有办法。您可以抛出自己的异常只是为了停止执行。我再说一遍，这不是一个好习惯

<script type="text/javascript">
function one(){
    var a = 1;
    console.log('one');
    if(a == 1){
        throw new RangeError("Sorry, but you are too young for this movie");
    }
}
function two(){
    console.log('two');
}
</script>

<button onclick="one();two();">Click me.</button>

Answer 2

您可以更改fn1函数以返回您执行的检查结果。然后，您可以将onclick属性更改为：

if (!fn1()) { fn2(); fn3(); };

我还建议您熟悉.addEventListener()而不是使用onclick属性。

Answer 3

您可以在按钮中设置if条件，类似于下面提到的条件：

<button onclick="if(!fn1()){fn2();fn3()}">Click</button>

Working Fiddle

Answer 4

试试这个：

<html>
<head>
  <script>
    function fn1() {
        alert('fn1()');
        return false;
    }

    function fn2() {
        alert('fn2()');
        return true;
    }

    function fn3() {
        alert('fn3()');
        window.location.assign("http://www.google.com");
    }
  </script>
</head>
<body>
    <button onclick="fn1()&&fn2()&&fn3()">Click</button>
</body>
</html>

所有函数都应返回布尔值然后使用逻辑运算符＆amp;＆amp;在onclick里面

<button onclick="fn1()&&fn2()&&fn3()">Click</button>

你可以看到fn1（）是否返回false f2（）和f3（）没有被执行。

停止多个内联函数JS的事件传播

4 个答案: