Javascript JQuery。只需每2次单击一次“工作”

我将JQuery与ReactJS一起使用。单击按钮时，第一次单击不起任何作用。但是，在第二次单击时，我尝试实现的操作确实有效。但这是一个每隔点击一次的胜利

我尝试在

openSubscriptionModalFromButton

函数中添加

$（document）.ready（）

。这并不能解决问题

我肯定会将

openSubscriptionModalFromButton

传递给我的组件

我已经研究过了。点击Jquery文档，我也读过关于在React；）中不要使用Jquery的文章

**在landing组件中，我希望Jquery单击的按钮（请参见id）

**在“模式从”工具栏中

<button
 onClick={() => props.openSubscriptionModalFromButton()}
>
 Upgrade/Toolbar
</button>

props.openSubscriptionModalFromButton（）}
>
升级/工具栏

现在我只是在控制台上记录“单击”，在2“单击”（第二次单击）时，它就工作了

我希望升级/工具栏按钮在每次单击时打开模式，而不是每隔一次

---

谢谢你的帮助。谢谢大家!

您是否尝试过简单地向按钮添加事件侦听器以避免任何其他潜在冲突（jQuery等）

//加载页面后。
window.onload=函数（）{
var UpgradeButton=document.getElementById（'right-top-corner-button_-upgrade'）；
UpgradeButton.addEventListener（'click'，函数（）{
警报（'在此处调用我的代码'）；
} );
};
升级/登陆
这可能是可行的，但是混合使用jQuery和React往往会有一些问题。主要的问题是，当React组件重新呈现时（默认情况下，会发生这种情况），属于该组件的任何DOM节点都将被React认为应该被替换的DOM节点替换，并且会破坏jQuery对这些DOM元素所做的任何更改

出现问题的一种可能性是，某些情况导致模态组件的某个祖先发生状态更改，这破坏了jQuery刚刚打开该组件的事实，因为jQuery通过更改DOM元素上的属性来跟踪模态是否打开

因此，我的建议是：当您单击此按钮时，确保您的祖先不会因为状态更改而重新渲染。在您不希望重新渲染的情况下，这可能需要定义返回
false

这可能更直接地通过JSFIDLE进行调试；现在，让我猜测一下：）
试试这个，而不是$（“#右上角按钮"升级”）。在（“单击”，function（）{this.closeDialog（）}）@MannyQuintanilla感谢您的建议，但它不起作用。感谢您的回复：）--我尝试添加事件侦听器，但没有成功。非常感谢。我的onlickjquery功能只在第二次点击时起作用，这解决了我的问题。感谢您对React vs jquery的解释——这很有可能发生。我自己也对这个React应用程序中的JQuery如此之多感到惊讶，并希望它能在已有的基础上运行。我想我要做的是完全绕过Jquery编写新函数，使其正常工作。
 openSubscriptionModalFromButton() {
  $('#right-top-corner-button_upgrade').click() 
  this.closeDialog() // closes the Modal pop-up on after the click
 }

<button
 onClick={() => props.openSubscriptionModalFromButton()}
>
 Upgrade/Toolbar
</button>