PHP内嵌点赞按钮计数器失效问题排查求助

让我帮你排查一下，这段代码里有三个关键问题导致点击按钮没反应：

1. 忘记引入jQuery库 #

你直接用了$（jQuery的简写语法），但整个页面根本没有加载jQuery框架！浏览器完全不知道$是什么，所以后续的事件绑定代码根本执行不了。

2. 事件绑定时机不对 #

你的脚本写在页面最开头，这时候浏览器还没渲染出.like_button和按钮这些DOM元素，就去执行绑定事件的代码了——相当于你要给一个还不存在的东西装开关，肯定装不上。

3. 选择器语法错误 #

原代码里的$("like_button button")是错的：.like_button是类名，选择器前面必须加英文句号.，正确写法是$(".like_button button")。否则浏览器会把like_button当成一个自定义HTML标签来查找，自然找不到你的按钮。

修复后的完整代码 #

我把所有问题都修正了，你可以直接测试：

<html>
<!-- 先引入jQuery库，用CDN方式最方便 -->
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script>
// 等DOM完全加载完成后再绑定事件
$(document).ready(function() {
    // 修正后的类选择器
    $(".like_button button").on("click", function() {
        var $count = $(this).parent().find('.count');
        // 用parseInt安全获取当前数值，避免非数字内容出错
        var currentCount = parseInt($count.text(), 10) || 0;
        $count.text(currentCount + 1);
    });
});
</script>
<?php 
echo '<div class="like_button"> 
        <button>Like</button> 
        <span class="count">0</span> 
      </div>'; 
?>
</html>

额外的重要提示 #

目前这个修复只是前端临时修改点赞数，刷新页面后数值会回到0。如果要让点赞数永久保存，你还需要做这些：

• 点击按钮时通过AJAX发送请求到PHP后端
• 后端将点赞数存储到数据库（比如MySQL）中
• 页面加载时，PHP从数据库读取最新的点赞数并输出到页面上

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