如果我们在button元素内部有其它的子元素并且绑定点击事件，比如：
而我们的代码是这样的：
<body ng-controller="ctrl"><script>angular.module("app", []).controller("ctrl", function($scope){$scope.sayButton = function(e){alert('button');};$scope.saySpan = function(e){alert('span');};})</script><button class="btn btn-default btn lg" ng-click="sayButton($event)">Button<span class="star glyphicon glyphicon-star" ng-click="saySpan($event)"></span></button></body>
这种情况下 chrome下点击span元素，会提示两个，即’span’和’button’，而对于IE则只提示’button’。（点击button均只提示’button’）
解决IE的处理点击事件错误的方式就是找“别的元素”来代替”button”元素，”狸猫换太子“。所以代码就变成了这样：
<div class="btn btn-default btn lg" ng-click="sayButton($event)">Button<span class="star glyphicon glyphicon-star" ng-click="saySpan($event)"></span></div>
这样结果对于chrome和IE结果都是一样的，点击span元素先提示’span’后提示’button’，点击button元素只提示’button’。
还有个问题就是阻止事件冒泡了，解决方法只需要在函数最后添加e.stopPropagation();这句代码，所以最终我们的结果就是：
<body ng-controller="ctrl"><script>angular.module("app", []).controller("ctrl", function($scope){$scope.sayButton = function(e){alert('button');e.stopPropagation();};$scope.saySpan = function(e){alert('span');e.stopPropagation();};})</script><div class="btn btn-default btn lg" ng-click="sayButton($event)">Button<span class="star glyphicon glyphicon-star" ng-click="saySpan($event)"></span></div></body>
效果图：（IE下）
Chrome下：
博客写到这FireFox也终于打开了，顺便看看效果：
FireFox下：
源代码：/justforuse/Pro_Angular-demo/tree/master/button-inner
此文档的作者：justforuse
Github Pages：justforuse
