绑定到click事件的代码为何在页面加载时就执行两次？

• 先确认动态输出的JS是否重复注入：你当前的绑定逻辑是通过PHP方法get_javascript()动态输出的，首先检查该方法是否在页面渲染流程中被调用了两次，导致同一段绑定代码被插入到页面两次。你可以打开浏览器开发者工具的「元素」面板，搜索fpd-share-button相关的绑定代码，若出现多次即为重复注入，给方法添加单次调用标记即可解决。
• 验证DOM中是否存在多个同ID元素：虽然ID属性要求全局唯一，但如果页面中重复出现了id="fpd-share-button"的元素，jQuery选择器会匹配所有符合的元素并逐一绑定事件。你可以在浏览器控制台执行jQuery('#fpd-share-button').length，若返回值大于1，修改重复ID即可。
• 排查是否有其他逻辑主动触发点击事件：页面其他位置的JS代码、第三方组件可能存在主动触发该按钮点击的逻辑（比如trigger('click')调用）。你可以在click回调第一行添加console.log(evt)，查看事件对象的isTrusted属性：真实用户点击时该值为true，代码主动触发时为false，即可快速定位是否是外部逻辑触发的问题。
• 调整阻止默认行为的位置并检查报错：你当前代码中的evt.preventDefault()写在alert之后，若alert之前的代码执行报错会导致该行不生效，可将evt.preventDefault()移到回调函数第一行再测试。同时打开开发者工具的控制台，查看是否有未捕获的JS报错影响事件逻辑。
• 临时用解绑再绑定的方式验证：将事件绑定代码修改为jQuery('#fpd-share-button').off('click').click(function(evt) { ... })，如果修改后问题消失，即可确定是重复绑定导致的问题，再回溯排查重复绑定的源头即可。

内容的提问来源于stack exchange，提问作者marcusredbie