奇怪的Html标签 Label 事件触发,有兴趣可以进来看看

[butnet]

<script>
    function test1(){
        alert('test1');
    }
    function test2(){
        alert('test2');
    }
    function test3(){
        alert('test3');
    }
    </script>
<label><input onclick="test1()" type="button" value="test1"><input onclick="test2()" type="button" value="test2"><input onclick="test3()" type="button" value="test3"></label>

前几天在使用HTML标签中的Lable时,遇到一个问题,代码简化后如上,
它在IE里的结果是正常的,两个按钮的事件是正常,
但在Firefox或者Chrome中,点击test1不会出现问题,
但当点击test2时,会先调用test2(),再调用test1().
点击test3时,分先调用test3(),再调用test1()
之前我以为是JS哪里写和事件有问题,
在仔细看了代码后,没有发现什么问题,
在看了网上也没有查到类似的情况,
最后在一位同事的帮助下,找到了问题:Label
把input外面的input去掉就不会有问题,
或者把两个input分别放到两label中,也不会出问题,
我怀疑是Label标签进行了某种封装,装事件分发给了自己的组件,
但是它们分发的明显有问题,
它的分发顺序是:

发生事件的当前组件 ----> 组件所在的Label ----> 此Label中的第一个组件的对应事件

非常不能理解它这样调用的好处