使用 AJAX 显示 SQL 查询结果

Question

我的网站上有一个新闻提要，用户可以在上面 post posts。然后这些 post 可以被其他用户喜欢（就像 facebook 一样）。

问题
我想显示喜欢 post 使用 ajax 的用户。每当某个元素悬停时。
目前用户已正确显示，但在每个 post 下方，而不仅仅是包含悬停元素的下方。

我解决问题的尝试

<!-- HOVER THIS -->
<span class="likers small link"></span>

<!-- DISPLAY LIKERS HERE -->
<small class="displayLikers"></small>

<!-- AJAX -->
<script>
    $(function() {
        $(".likers").hover(function(){
            $.ajax({
                url: "get/likers",
                type: "GET",
                success: function(response) {
                    $(this).closest('.displayLikers').html(response);
                }
           });
        });
    });
</script>

如果有任何帮助，我将不胜感激！

Answer 1

在$.ajax里面，$(this)不引用$(".likers")只是把$(this)加到一个变量里，在ajax响应函数中使用；

$(function() {
    $(".likers").hover(function(){
        var likes = $(this);
        $.ajax({
            url: "get/likers",
            type: "GET",
            success: function(response) {
                likes.closest('.displayLikers').html(response);
            }
       });
    });
});

Answer 2

在您的示例中，.displayLikers 是兄弟，因此您可能应该使用 next()。而且 this 会引用成功函数的实际上下文，所以你必须先创建一个引用。

$(function() {
    $(".likers").hover(function(){
        var self = $(this);
        $.ajax({
            url: "get/likers",
            type: "GET",
            success: function(response) {
                self.next('.displayLikers').html(response);
            }
       });
    });
});

使用 AJAX 显示 SQL 查询结果

Display SQL Query Result using AJAX

javascript

ajax

jquery

this