使用 jQuery 响应删除点击事件

Question

我有一个具有onClick属性的标签。如何使用 jQuery 从标签中删除事件？这可能吗？

Answer 1

哦，上面的答案给了我一些想法，所以不要覆盖组件道具，而是覆盖事件。

<button onClick={this.props.handleClick}>click me</button>
var elem = $('.yourbutton');
elem.click(() => { return false }); 

Answer 2

不，这是不可能的。您可以添加一个新事件，然后停止传播，但这很笨拙。jQuery无法删除它不拥有的事件。

如果组件组成 props，您可以覆盖它或添加onClickCapture={e => e.stopPropagation()}

例如，如果您的组件允许您传递 props，即使 onClick 是在 prop 传播之后，您仍然可以通过在处理程序之前触发的事件的捕获阶段来执行此操作：

class Foo extends React.Component {
handleClick(e){
console.info(e)
}
render(){
return <button {...this.props} onClick={this.handleClick}>click me</button>
}
}
const app = document.getElementById('app')
ReactDOM.render(<Foo onClickCapture={e => e.stopPropagation()} />, app)

https://jsfiddle.net/tdbs7h05/

否则，您可以阅读源代码并通过更改组件的原型来"破解它"。例如：

class Foo extends React.Component {
handleClick(e){
console.info(e)
}
render(){
return <button onClick={this.handleClick}>click me</button>
}
}
const app = document.getElementById('app')
Foo.prototype.handleClick = (e) => e.preventDefault() || e.stopPropagation()
ReactDOM.render(<Foo />, app)