火狐、IE下点击button下子元素不发生冒泡

代码如下：

<button onclick="alert('parent')" style="width:300px;height:200px;background-color:red;">我是parent
    <div onclick="stopEvent();alert('children1')" style="width:200px;height:200px;background-color:yellow;">我是children1
        <div onclick="stopEvent();alert('children2')" style="width:100px;height:200px;background-color:green;">我是children2</div>
    </div>
</button>

在Firefox和IE浏览器下，点击子1子2，弹出来的alert都是parent，而在Ghrome等浏览器下是正常发生事件冒泡。

目前只能通过将button换成其他元素比如div，则和其他浏览器一样会发生冒泡事件。

若哪位大佬知道原因或者更好解决方法请留言交流交流。

另附上兼容各浏览器的阻止冒泡事件方法：

//得到事件
function getEvent(){
     if(window.event){return window.event;}
     func=getEvent.caller;
     while(func!=null){
         var arg0=func.arguments[0];
         if(arg0){
             if((arg0.constructor==Event || arg0.constructor ==MouseEvent || arg0.constructor==KeyboardEvent)
                ||(typeof(arg0)=="object" && arg0.preventDefault && arg0.stopPropagation)){
                 return arg0;
             }
         }
         func=func.caller;
     }
     return null;
}

//阻止冒泡
function stopEvent(){
	var e=getEvent();
	if(window.event){
	    //e.returnValue=false;//阻止自身行为
		e.stopPropagation();//阻止冒泡
	 }else if(e.preventDefault){
	    //e.preventDefault();//阻止自身行为
	    //阻止冒泡
	    e.cancelBubble=true;
	 }
}