我在使用 AJAX 时遇到了很多麻烦。我想要 ajax 改变 div 的颜色。首先是直接的,确实如此。然后它应该将其保存在数据库中,但事实并非如此。 问题是这样的:它不会改变数据库中的列。没有保存。
jQuery 请求 AJAX 文件
$(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.';
}
我在这里忽略了什么吗?上面报告了预期的行为,我想要一个 div 重新着色,但是,它没有保存,这就是问题所在。所有代码都可以用来重现错误,并且没有最小版本。这是需要修复的代码,而不是完整的其他代码。
你的代码接缝很好,也许你只是迷失了,因为你有很多jquery选择器,我建议是使用数据键来设置颜色,它将在你的脚本中节省大量空间,
$(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');
}
通常这应该有效,但我还没有测试过。