使用Ajax发送数据Jquery - Sending Data with Ajax & Jquery

Sending Data with Ajax & Jquery

本文关键字：数据 Jquery Ajax 使用 | 更新日期: 2023-09-27

编辑修复-问题解决

上下文:我试图创建一个页面，单击图像更改用户在服务器上的首选项。尝试使用ajax发送信息而不刷新页面，并使用Jquery触发发布。

问题:似乎什么都没有张贴。似乎ajax没有将数据发送到data.php文件。

预期动作: 当图像被点击时，父母的id将被张贴在该用户的游戏列中。

header。php

<script type="text/javascript">
  $(document).ready(function(){
    $(".pickteam").click(function() {
        var game = $(this).parent().attr('data-id');
     $.ajax
        ({ 
            url: 'data.php',
            data: {game: game},
            type: 'post',
        });
    });
 });
</script>

index . php

<div class="col-md-3 team1 otherteam" data-id="m004">
    <button class="pickteam">
        <img src="http://img.fifa.com/images/flags/4/bra.png" alt="Brazil">
    </button>
    <span class="country">BRAZIL</span>
</div>

data.php

$game = $_POST['game'];
mysqli_query($con, "INSERT INTO choices (user, game) VALUES ('12345', '$game')");

提前感谢所有的帮助。

我猜你没有得到你的数据id正确，因为你的jQuery代码应该是var game = $(this).parent().attr('data-id');，所以把它们放在一起:

<script type="text/javascript">
    $(".pickteam").click(function() {
        var game = $(this).parent().attr('data-id');
     $.ajax
        ({ 
            url: 'data.php',
            data: {game: game},
            type: 'post'
        });
    });
</script>

使用var game = $(this).parent().attr('data-id');从父div

获取值

和删除额外的逗号从你的ajax函数附近的type : "post",，所以最终的代码应该是:

<script type="text/javascript">
$(document).ready(function(){
        $(".pickteam").click(function() {
            var game = $(this).parent().attr('data-id');
         $.ajax
            ({ 
                url: 'data.php',
                data: {game: game},
                type: 'post'
            });
        });
});
</script>

你需要使用

var game = $(this).parent().attr('data-id');

获取data-id属性的值。目前还不清楚到底是哪里出了问题。你能否提供更多关于你被困在哪里的细节?

您只需要将您的代码包装在Document ready包装器中:

<script type="text/javascript">
$(document).ready(function(){
    $(".pickteam").click(function() {
        var game = $(this).parent().data('id');
     $.ajax
        ({ 
            url: 'data.php',
            data: {game: game},
            type: 'post',
        });
    });
});    
</script>