jQuery ajax循环包含仅更改最后出现的onclick事件。

15 浏览
0 Comments

jQuery ajax循环包含仅更改最后出现的onclick事件。

我的页面显示了存储在我的数据库中的帖子,并为每个帖子配对了一个赞/踩按钮。\n我想实现的是,当用户点击赞或踩时,将该值发送到我的数据库以便以后回忆。\n我有一个复杂的循环,希望能解释一下:\n在页面加载时,会调用一个ajax方法来从我的数据库中获取数据。结果是一个对象数组,其中包含了“postID”:value的键值对。在一个for循环中,我将该值存储在变量postID中以便于访问。显然,我做错了,因为代码确实执行了,但无论我按下哪对按钮,它只发送最后一次循环中的值和postID:如果数据库中有11个帖子,我在第3个帖子上按下“赞”,它将存储值“赞”,但是对于第11个帖子。如果我在第7个帖子上按下“踩”,它将存储值“踩”,但是对于第11个帖子。\n所以问题是,我应该如何修复这个问题,以便当我按下对帖子x的赞或踩时,它会为该帖子存储值,而不是数据库中的最后一个帖子?\n数组的样式如下:\n{\"s\":0,\"d\":[{\"postID\":\"1\"},{\"postID\":\"2\"},{\"\"pos‌​tID\":\"3\"},{\"\"pos‌​tID\":\"4\"},{\"\"pos‌​tID\":\"5\"},{\"\"pos‌​tID\":\"6\"},{\"\"pos‌​tID\":\"7\"},{\"\"pos‌​tID\":\"8\"},{\"\"pos‌​tID\":\"9\"},{\"\"pos‌​tID\":\"10\"},{\"\"pos‌​tID\":\"11\"}]}\n\n帖子div的格式如下:\n

 //#代表数据库中的postID
     //#代表数据库中的postID
     //#代表数据库中的postID

\n我的jQuery代码(仅包括赞按钮):\n

$(document).ready(function() {
    $.ajax({
        url: 'postID.php', //获取上述数组
        type: 'POST',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        async: true,
        cache: false,
        success: function (post) {
                    if (post.s == 0) {
                    //使用post.d循环遍历返回的数据数组
                        for (var key in post.d) {
                            var obj = post.d[key];
                            for (var prop in obj) {
                                var postID = obj[prop];
                                //当点击赞按钮时执行以下操作
                                $('#like_' + postID).click(function() {
                                    // 声明变量
                                    var value = '1';
                                    // 将值发送到数据库
                                    $.ajax({
                                        url: 'check.php', //check.php接收到发送过来的值并将其存储到数据库中
                                        type: 'POST',
                                        data: 'postID=' + postID + '&value=' + value,
                                        success: function(result) {
                                            $('#Message_'+ contestID).html('').html(result).prependTo('#post_' + postID);
                                        }
                                    });
                                 });
                             }
                         }
                     }
                  }
     });
});

\n所以,我的问题是第二个ajax循环只发送变量postID的最后一个实例,而不是发送实际点击的帖子的postID。\n有什么想法吗?

0
0 Comments

问题的出现的原因是因为使用了.live()方法,而这个方法在1.7版本之后就被弃用了。解决方法是使用.on()方法来替代.live()方法。

解决方法如下:

首先,需要更新html结构,给每个post添加一个唯一的id,以表示数据库中的postID。然后,在每个post中添加一个like按钮和一个dislike按钮。

然后,在jQuery代码中,使用.on()方法来绑定like按钮的点击事件。在点击事件中,获取当前like按钮的id,并从中提取出postID。然后,发送一个ajax请求到check.php文件,将postID和value作为数据发送到服务器。

在成功回调函数中,将服务器返回的结果显示在页面上。

最后,将代码上传到jsfiddle.net,并提供链接,以便其他人查看和调试代码。

问题的解决方法是:确保html结构与上述结构相同,并将postID设置为like div的php变量。这样就可以完美地解决问题了。

0