在过去的两周里,我断断续续地尝试不止一次让我的 Ajax 调用正常工作,我是自学成才并尽最大努力自己解决问题,但这个问题让我很难受。一些遇到同样问题的人使用了 .on,它似乎对他们有用,但我仍然只能让它工作一次。
这个想法是让用户点击页面上的按钮,他们因此获得 XP。
<div id="AJTestt">Ajax Test</div>
<script>
$(document).on('click', "#AJTestt", function($id, $SkillOne, $XP) {
$id = <?php if(isset($_SESSION['id'])) echo $_SESSION['id']; ?>;
$SkillOne = <?php if(isset($SkillOne)) echo $SkillOne; ?>;
$XP = 3;
//get the input value
$.ajax({
url: "ax.php",
cache: "false",
data: {id : $id, SkillOne: $SkillOne, XP: $XP},
dataType: 'text',
type: "POST",
success: function(data){
console.log("Success");
console.log(data);
history.back(); //Just to remove the ax.php bit
},
error: function(){
console.log("Error");
console.log(data);
}
});
});
</script>
//////// PHP代码(ax.php)
<?php
require_once 'resource/Database.php';
$id = $_POST['id'];
$SkillOne= $_POST['SkillOne'];
$XP = $_POST['XP'];
echo "$id \n";
echo "$SkillOne \n";
echo "$XP \n";
if($XP==1){
$SkillOne = $SkillOne +1;
}
else if($XP==2){
$SkillOne = $SkillOne +2;
}
else if($XP==3){
$SkillOne = $SkillOne +3;
}
$sqlUpdate = "UPDATE users SET SkillOne =:SkillOne WHERE id =:id";
$statement = $db->prepare($sqlUpdate);
$statement->execute(array(':SkillOne' => $SkillOne, ':id' => $id));
echo $SkillOne;
?>
第一次一切正常,控制台显示(用于测试目的): -成功 -ID -老Xp -Xp待补充 -新经验
但如果我再次单击同一个按钮,它会在控制台中显示完全相同的值。
任何帮助将不胜感激, 亲切的问候 翅膀
最佳答案
我认为它就这么简单,但我可能错了。
click 函数创建一个 event
对象并使其像这样可用,因此您不能像这样将变量/数据传递给该函数:
.on('click', '#myElement', function(event) {
event.preventDefault();
});
您可以像这样将数据/变量传递给函数(参见 dataVariable
):
.on('click', '#myElement', dataVariable, function(event) {
doSomethingWith(dataVaraible);
});
如果您确实需要将数据传递给处理程序,那么您可以将 $id
、$SkillOne
和 $XP
放在一个对象中,然后将对象交给处理程序:
var data = { id: 1, skillOne: 'blah', xp: 100 };
.on('click', '#myElement', data, function(event) {
doSomethingWith(data);
});
但我认为你不需要将任何东西传递给函数,你可以像这样在里面使用它们
<script>
$(document).on('click', "#AJTestt", function() {
var $id = <?php if(isset($_SESSION['id'])) echo $_SESSION['id']; ?>,
$SkillOne = <?php if(isset($SkillOne)) echo $SkillOne; ?>,
$XP = 3;
//get the input value
$.ajax({
url: "ax.php",
cache: "false",
data: {id : $id, SkillOne: $SkillOne, XP: $XP},
dataType: 'text',
type: "POST",
success: function(data){
console.log("Success");
console.log(data);
history.back(); //Just to remove the ax.php bit
},
error: function(){
console.log("Error");
console.log(data);
}
});
});
</script>
关于javascript - 即使使用 .on,Ajax 调用也只能使用一次,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51919810/