Question

以下代码允许用户点击按钮并拒绝好友请求。即使在页面上显示多个结果，它也能正常运行，因为它使用wrapper.children('.decline').click(function() {来定位正确的结果。

发生这种情况后，以下$( "#containerFriends" ).load("friends.html #containerFriends" );应刷新页面，以便显示最新结果。但是，即使结果仍然存在，也会显示完全空白的页面。如果我手动刷新页面，则会显示正确的结果。

我不确定下面有什么问题以及造成这种问题的原因是什么？

mainQuery.find({
            success: function(results) {
                var friends = [];
                for (var i = 0; i < results.length; i++) {
                    friends.push({
                        imageURL: results[i].get('toUser').get('pic'),
                        username: results[i].get('toUser').get('username'),
                        userId: results[i].get('toUser').id,
                        status: results[i].get('status'),



                        // Saves the object so that it can be used below to change the status//
                        fetchedObject: results[i]


                    });


                }
                var select = document.getElementById("FriendsConnected");
                $.each(friends, function(i, v) {
                    var opt = v.username;
                    var el = document.createElement("option");
                    el.textContent = opt;
                    el.value = opt;
                    select.appendChild(el);
                })


                $('#containerFriends').empty();
                $('#containerFriendsConnected').empty();

                _.each(friends, function(item) {
                    var wrapper = $('<div class="portfolio-item-thumb one-third"></div>');
                    wrapper.append('<img class="responsive-image friendImgOutline" src="' + item.imageURL + '" />' + '<br>');
                    wrapper.append('<div class="tag">' + item.username + '</div>');
                    wrapper.append('<div type="button" class="btn btn-danger mrs decline">' + 'Unfriend' + '</div>');

                    $('#containerFriends').append(wrapper);



                    //The following lets the user accept or decline a friend request by changing the status the status from Pending to Declined/////
                    wrapper.children('.decline').click(function() {
                        $(".decline").click(function() {
                            item.fetchedObject.set("status", "Rejected");
                            $( "#containerFriends" ).load("friends.html #containerFriends" );


                            item.fetchedObject.save(null, {
                                success: function(results) {
                                    console.log("REJECTED");

                                },
                                error: function(contact, error) {
                                    // The save failed.
                                    // error is a Parse.Error with an error code and description.
                                    alert("Error: " + error.code + " " + error.message);
                                }
                            });


                        });


                    });

                });

            },
            error: function(error) {
                alert("Error: " + error.code + " " + error.message);
            }
        });

Answer 1

我实际上是通过再次调用该函数来解决这个问题，然后确保数据是最新的并刷新页面。我认为问题是$('#containerFriends').append(wrapper);在用户.click

之后确实包含了更新后的数据

在.click之后，JavaScript .load没有显示正确的页面结果

1 个答案: