jQuery Color Changer - Ajax保存未运行

时间:2016-09-03 19:05:53

标签: php jquery ajax

Hello Stackers,

我在使用AJAX时遇到了很多麻烦。我想要ajax来改变div的颜色。首先直接,它做到了。然后它应该将它保存在数据库中,它没有。没有关于stackoverflow的其他问题包含了我的解决方案。

问题是:它不会改变数据库中的列。它没有存储。

请求AJAX文件的jQuery

$(document).ready(function() {
    var uid = <?php echo $user['id']; ?>;
$('#blue').click(function() {
    $('#upbar').css({
        'background-color': '#3498db',
        'background-image': 'none',
    });

    $.ajax({
                method: 'post',
                url: 'app/tpl/skins/Magical/includes/ajax.php',
                data: {
                    action: 'update_blue',
                    id: uid,
                }
            })

});

$('#purple').click(function() {
    $('#upbar').css({
        'background-color': '#9b59b6',
        'background-image': 'none',
    });

    $.ajax({
                method: 'post',
                url: 'app/tpl/skins/Magical/includes/ajax.php',
                data: {
                    action: 'update_purple',
                    id: uid,
                }
            })

});
$('#red').click(function() {
    $('#upbar').css({
        'background-color': '#e74c3c',
        'background-image': 'none',
    });

    $.ajax({
                method: 'post',
                url: 'app/tpl/skins/Magical/includes/ajax.php',
                data: {
                    action: 'update_red',
                    id: uid,
                }
            })
});
$('#yellow').click(function() {
    $('#upbar').css({
        'background-color': '#f39c12',
        'background-image': 'none',
    });

    $.ajax({
                method: 'post',
                url: 'app/tpl/skins/Magical/includes/ajax.php',
                data: {
                    action: 'update_yellow',
                    id: uid,
                }
            })
});
$('#image1').click(function() {
    $('#upbar').css({
        'background-image': 'url("app/tpl/skins/Magical/assets/images/header-magie.png"),
    });

    $.ajax({
                method: 'post',
                url: 'app/tpl/skins/Magical/includes/ajax.php',
                data: {
                    action: 'update_image1',
                    id: uid,
                }
            })
});
});

ajax.php

 error_reporting(E_ALL);
 ini_set('display_errors', '1');


if(!isset($_POST["action"])) {
    exit("fail");
}

$user = $_POST['id'];

switch ($_POST["action"]) {

        case "update_blue":
            echo "1";
            $update = mysql_query("UPDATE users SET magical_header = '1' WHERE id = '".$user."'")or die(mysql_query());
        break;

        case "update_purple":
            echo "2";
            $update = mysql_query("UPDATE users SET magical_header = '2' WHERE id = '".$user."'");
        break;

        case "update_red":
            echo "3";
            $update = mysql_query("UPDATE users SET magical_header = '3' WHERE id = '".$user."'");
        break;

        case "update_yellow":
            echo "4";
            $update = mysql_query("UPDATE users SET magical_header = '4' WHERE id = '".$user."'");
        break;

        case "update_image1":
            echo "5";
            $update = mysql_query("UPDATE users SET magical_header = '5' WHERE id = '".$user."'");
        break;  

    default:
        echo 'I did not know that you were there.';

}

我在这里俯瞰什么吗?为什么这不是offtopic;上面报告了预期的行为,我希望DIV重新着色,然而,它没有保存,而且这个问题再次明确地在上面说明了。所有代码都可用于重现错误,并且没有最小版本。这是需要修复的代码,而不是完整的代码。

1 个答案:

答案 0 :(得分:1)

你的代码接缝很好,也许你只是丢失了因为你有很多jquery选择器,我建议使用数据键设置颜色,它会在你的脚本中节省大量空间,< / p>

$(document).ready(function(){
    var uid = 'something';
    $('.colorButton').on('click', function(){
        var color = $(this).data('color');
        $.ajax({
            'url':'path/to/your/file/ajax.php',
            'method':'POST',
            'data':{'action': color, 'uid':uid},
            'success':function(){
                console.log('success')
            }
        });
    });
});

有一些像

这样的基本html
<div>
    <button class="colorButton" data-color="update_yellow"></button>
    <!-- and all your other buttons -->
</div>

这会使你的代码变得有点紧张。 现在,为您的Ajax.php页面。 您可以使用关联数组来验证颜色,然后只使用一个查询来更新数据库。我还建议绑定您的参数,以确保您能够防止注射。
我会建议类似的东西。

<?php
    if(isset($_POST['action']) && isset($_POST['uid'])){
        $ALLOWED_ACTION = array('update_yellow' => '4', 'update_blue' => '1' ) // add the rest
        if(array_key_exists($_POST['action'], $ALLOWED_ACTION)){
            $stm = mysqli_prepare('UPDATE users SET magical_header = ? WHERE uid = ?')
            $stm->bind_param('s', $ALLOWED_ACTION[$_POST['action']]); // S for string
            $stm->bind_param('i', $_POST['uid']); // I for integer
            $stm->execute();
        } else {
            die('invalid action');
        }
    } else {
        die('Invalid Parameters');
    }

Normaly这应该有效,但我还没有测试过它。 希望它有所帮助!

  • 尼克