我想弄清楚为什么 stopPropagation 在与 google 闭包组件一起使用时不起作用。它适用于 browserEvents 但不适用于组件上的事件。请参阅下面的示例代码，该代码在您的浏览器上演示了该现象:
<html>
<head>
<script type="text/javascript" src="closure/goog/base.js"></script>
</head>
<body>
<div id="div1" style="border: 1px solid black; width: 500px; height: 300px; padding: 10px">
<div id="div2"></div>
</div>
<script>
goog.require('goog.dom');
goog.require('goog.ui.CustomButton');
goog.require('goog.ui.Component');
goog.require('goog.ui.Control');
goog.require('goog.style');
</script>
<script>
var outerBtn = new goog.ui.Control();
outerBtn.decorate(goog.dom.$('div1'));
var innerBtn = new goog.ui.CustomButton('Inner Button');
outerBtn.addChild(innerBtn, true);
outerBtn.setSupportedState(goog.ui.Component.State.FOCUSED, false);
innerBtn.setSupportedState(goog.ui.Component.State.FOCUSED, false)
goog.style.setStyle(innerBtn.getElement(), {
border : '1px solid red',
height : '100px'
});
goog.events.listen(outerBtn, goog.ui.Component.EventType.ACTION, function() {
console.info('outer');
});
goog.events.listen(innerBtn, goog.ui.Component.EventType.ACTION, function(e) {
console.info('inner');
e.stopPropagation();
});
</script>
</body>
</html>
最佳答案
您的示例输出:
inner
outer
在这种情况下，e.stopPropagation 工作正常。 控制台输出“outer”是由于 outerBtn 自己的事件处理程序。没有从 innerBtn 中冒出来。 此外，注释掉 e.stopPropagation，输出将改变如下:
innner
outer
outer
关于javascript - 谷歌闭包库 : stopPropagation on components，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/13702319/