0

对于我的个人项目，我正在尝试制作一个积分系统。基本上我想做的是：单击一个按钮（Jquery），然后向数据库发送查询，最后向用户显示自动更新的点。我想我可以使用ajax。

$(this).html('Thank you for granting EXP!');
var dataString = 'username=' + username+ '&name='+ name + '&count=' + count + '&message_id=' + message_id;

    $.ajax({
    type: "POST",
    url: "index.php?&page=profile",
    data: dataString,
    success: function() {
        $('#skills').load('./modules/skill_table.php');
    }
    });

此 Ajax 请求请求正确的页面。在那个页面上有一个 MySQLi 查询，它也执行得很好。问题是我想在完成查询后重新加载显示点的正确 div。当它重新加载 div 时，我看不到任何变化。关于我能做什么的任何建议？我是这样的 ajax 调用的新手。我可以对（数据）响应做一些事情，但这是否意味着我必须为这个请求编写一个单独的 php 文件？

编辑：上面的代码有效。它执行 MySQL 查询并更新数据库。.load(); 功能也有效！当我尝试 .load('someotherfile.php'); 它显示另一个文件。问题是：当我尝试重新加载当前模块（skill_table.php）时，它显示旧值而不是更新值。我希望这个解释好一点。

它使用新的数据库值重新加载 Skill_table.php 模块，但它显示旧的。

4

4 回答 4

1

这是一个更完整的示例，说明如何发出有效的 POST 请求并在 AJAX 中捕获响应并一次性返回。这只是许多方法之一，请注意这个例子是模糊的。请向它学习并根据您的需要塑造它。

您的 AJAX 请求

$.post(
    // This is the URL your posting to
    'index.php?page=profile', 
    // This is the JSONified version of your post data
    {
        "username":username,
        "name":name,
        "count":count,
        "message_id":message_id
    }, 
    // Handling your response here
    function(returnString) {
        // Check to ensure your php code worked
        if(returnString.success === 1) {
            // Insert your new DOM
            $('#skills').html(returnString.response);
        } else {
            // Send error message here
            window.alert('Oh noes! The world is ending!');
            // alertnatively
            //window.alert('Error:' + returnString.response);
        }
    }
);

假设的 PHP 文件

header("Content-type: application/json");

$mysqli->doMyAwesomeMySQLQueryHere();
$success = ($DidMyQueryWork) ? true : false;

echo json_encode(
        array(
            'success' => $success, 
            'response' => 'Your DOM Here'
        )
);
于 2013-01-14T15:57:52.837 回答
1

.load 正在从缓存中提取。如果这是一个 GET 请求，您可以告诉它不要使用缓存，但由于您正在发布，您必须在加载的 URL 的末尾添加一些任意随机元素。尝试这个：

 $.ajax({
    type: "POST",
    url: "index.php?&page=profile",
    data: dataString,
    success: function() {
        $('#skills').load('./modules/skill_table.php?_=' + (new Date()).getTime();
    }
    });

此外，由于您使用的是 jQuery，请查看 .serialize() 以帮助从数组构造您的 dataStrings。

http://api.jquery.com/serialize/

于 2013-12-17T09:37:14.540 回答
0

最好在 ajax 响应中发送表格或 html（只发送一个请求）： 

$.ajax({
  type: "POST",
  url: "index.php?page=profile",
  data: dataString,
  async:false,
  success: function(data) {
      $('#skills').html(data);
  }
});

索引.php： 

include('./modules/skill_table.php');
于 2013-01-14T16:23:30.800 回答
0

您需要正确构造数据参数。IE，让 jQuery 构造它：

$(this).html('Thank you for granting EXP!');    
    $.ajax({
    type: "POST",
    url: "index.php?&page=profile",
    data: {'username' : username, 'name' : name, 'count' : count, 'message_id' = message_id },
    success: function() {
        $('#skills').load('./modules/skill_table.php');
    }
});
于 2013-01-14T16:16:25.503 回答