JS中DOM元素监听了多个事件，如何只触发一个事件

Question

项目中有个需求，某个DOM元素绑定了多个事件，在某些情况下，只触发其中一个特定事件

可能之前没讲清除需求，下面代码中的例子，事件a是某框架实现的，无法改内部源码。因特殊需求，对于某个DOM元素需要再次绑定一个事件，但是该事件只有在满足条件的情况下才执行。。jquery的trigger方法可以满足，通过传参数来判断。原生的怎么写呢，

之前大部分答案都是说在同一个事件里做判断，因无法改变框架源码所以方法行不通。。

    <button id="button">button</button>
    <script type="text/javascript">
        var button = document.querySelector('button');

        var a = function(e){
            console.log('a');
        };

        var b = function(e){
            console.log('b');
        };

        button.addEventListener('click', a);
        button.addEventListener('click', b);
        
        button.click();
    </script>

代码如上，如何让button只触发a事件，而不触发b事件

Answer 1

这个应该是有条件的吧？满足条件A，则触发a事件，否则触发b事件

Answer 2

jqurey中有自定义事件~~~~你可以试试触发自定义事件来实现

Answer 3

你既然说了，在某些情况下。

那你就要在事件里去判断，当前是不是这样的情况。

---

总要判断的。

Answer 4

是不是可以换个思路，允许事件触发；但是在处理函数的头部做判断，条件不符合则退出不往下执行？

var a = function(e){
    if(!valid){
        return;
    }
    console.log('a');
};

Answer 5

e.cancelBubble=true;// ie下阻止冒泡
e.stopPropagation();// 其它浏览器下阻止冒泡

Answer 6

jquery使用命名空间

$('button') .on('click.myNamespace', function() { console.log('a'); }); 
$('button') .on('click.myNamespace2', function() { console.log('b'); }); 
$('button').trigger('.myNamespace2');

Answer 7

既然你自己都清楚是某些情况下，那为什么不都卸载同一个click事件里面，在事件里面进行判断呢？
总归是要判断的，写到一起还更方便点。

Answer 8

用的是框架，在事件里条件判断不行

Answer 9

我觉得可以试一下阻止默认行为的方法，然后根据你的入参不同（或者条件不同）去触发不同的方法。

Answer 10

使用stopImmediatePropagation