我试图在ReactJS组件中使用event.stopPropagation()来阻止click事件冒泡并触发在遗留代码中附加了JQuery的单击事件,但是React的stopPropagation()似乎只停止传播到也附加在React中的事件,而stopPropagation()不停止传播到附加到React的事件。
有没有办法让stopPropagation()在这些事件中工作?我编写了一个简单的JSFiddle来演示这些行为:
/** @jsx React.DOM */
var Propagation = React.createClass({
alert: function(){
alert('React Alert');
},
stopPropagation: function(e){
e.stopPropagation();
},
render: function(){
return (
<div>
<div onClick={this.alert}>
<a href="#" onClick={this.stopPropagation}>React Stop Propagation on React Event</a>
</div>
<div className="alert">
<a href="#" onClick={this.stopPropagation}>React Stop Propagation on JQuery Event</a>
</div>
<div onClick={this.alert}>
<a href="#" className="stop-propagation">JQuery Stop Propagation on React Event</a>
</div>
<div className="alert">
<a href="#" className="stop-propagation">JQuery Stop Propagation on JQuery Event</a>
</div>
</div>
);
}
});
React.renderComponent(<Propagation />, document.body);
$(function(){
$(document).on('click', '.alert', function(e){
alert('Jquery Alert');
});
$(document).on('click', '.stop-propagation', function(e){
e.stopPropagation();
});
});
https://stackoverflow.com/questions/24415631
复制相似问题