通过 onClick javascript 函数使用 PHP 更新 MySql 数据库答案

【问题标题】：Updating a MySql database using PHP via an onClick javascript function通过 onClick javascript 函数使用 PHP 更新 MySql 数据库
【发布时间】：2010-10-12 21:29:18
【问题描述】：

我正在创建一个针对儿童的学习新单词的网络游戏。

我有一组四个链接，每个链接显示从我的数据库中检索到的特定单词和一条线索，我需要检查已选择的单词是否与该线索的正确单词匹配。

我知道我需要使用 javascript，因为 onClick 功能，我可以成功检查所选单词是否与正确的单词匹配。但是，如果单词匹配正确，我需要更新数据库中保存的分数，因此我需要使用 php。

据我所知，这意味着我必须使用 AJAX，但我找不到任何人使用 AJAX onClick 链接然后更新数据库的好例子。

我曾尝试这样做...但它可能完全错误，因为我无法使其正常工作：

//This is my link that I need to use in my game.php file where $newarray[0] is that answer I want to check against $newarray[$rand_keys]

<a onClick=originalUpdateScore('$newarray[0]','$newarray[$rand_keys]')>$newarray[0]</a>

//我在 score.js 文件中的 ajax 尝试

var xmlHttp;

function originalUpdateScore(obj,corr){
    xmlHttp=GetXmlHttpObject();
if (xmlHttp==null)
{
    alert ("Browser does not support HTTP Request");
    return;
}

if(corr == obj){

var url="getscore.php";
//url=url+"?q="+str;
//url=url+"&sid="+Math.random();
xmlHttp.onreadystatechange=stateChanged;
//xmlHttp.open("GET",url,true);
xmlHttp.open(url,true);
xmlHttp.send(null);

    alert('Correct');

}
else
{
    alert('AHHHHH!!!');
}

window.location.reload(true);

}

function stateChanged() 
    { 
    if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
    { 
        document.getElementById("txtHint").innerHTML=xmlHttp.responseText;
    } 
}
function GetXmlHttpObject()
{
    var xmlHttp=null;
    try
    {
        // Firefox, Opera 8.0+, Safari
        xmlHttp=new XMLHttpRequest();
    }
    catch (e)
    {
        //Internet Explorer
        try
        {
            xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
        }
        catch (e)
        {
            xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
    }
return xmlHttp;

}

//attempting to update the database in a getscore.php file

<?php
//$q=$_GET["q"];
include("dbstuff.inc");
$con = mysqli_connect($host, $user, $passwd, $dbname)
or die ("Query died: connection");

$sql= "UPDATE `temp` SET `tempScore`= `tempScore`+1 WHERE (temp.Username='$_SESSION[logname]')";

$showsql = "SELECT `tempScore` FROM `temp` WHERE (temp.Username='$_SESSION[logname]')";
$result = mysqli_query($con, $showsql);

echo "$result";

mysqli_close($con);
?>

【问题讨论】：

标签： php javascript mysql ajax

【解决方案1】：

我强烈建议正确学习 AJAX - 它不会花费你很多时间，但会帮助你了解你可以做什么，不能做什么。

通过 AJAX 从网页更新数据库非常常见。我建议使用 jQuery（一个 JavaScript 库）来简化你的 JavaScript 开发。 jQuery和AJAX有很好的介绍here。

基本上，jQuery 会为您编写大量样板代码。你最终会写的是这样的：

function updateScore(answer, correct) {
  if (answer == correct) {
    $.post('updatescore.php');
  }
}

...

<a onclick="updateScore(this, correct)" ...> </a>

您在这里所做的是在答案正确时向updatescore.php 发送POST 请求。

然后，在你的updatescore.php中，你只需要像你已经做的那样有PHP代码来更新数据库中的分数。

你显然可以做比这更复杂的事情，但希望这足以让你开始。

【讨论】：

非常感谢您的帮助！你给我的那个链接也很有用。

【解决方案2】：

我注意到你有“window.location.reload(true);”在你的代码中。为什么？这似乎会让事情变得不正常。

您应该尝试分析您的程序以找出问题所在。然后，您将能够向我们提出一个非常具体的问题，例如“为什么当我单击此链接时 Firefox 不触发 onClick 处理程序”，而不仅仅是发布三页代码。当您粘贴这么多代码时，我们很难找到您的错误。

所以这里是你应该问的问题：

是否正确解析了我的 HTML？ 对我来说，它看起来可能无法正确解析，因为您没有在 onClick 的值周围加上引号。您应该使用引号，例如：onClick="..." 要确定您的 HTML 是否被很好地解析，您可以使用 Firefox 的 View->Source 功能并查看它打印的颜色。
我的 onClick 处理程序被调用了吗？看起来您正在有效地使用 alert()，这很好。
请求是否真的发送到我的服务器？要确定这一点，您应该使用 Firefox，并安装 Firebug 扩展。在“Net”面板中，它将显示您的页面正在发出的所有 AJAX 请求，并显示从服务器返回的结果。
我的服务器上的脚本做对了吗？所以在服务器端，您现在可以添加像“echo 'hello world';”这样的行您将在 Firebug Net 面板中看到该输出，这将帮助您调试服务器端脚本的行为。
我的 stateChanged 函数被调用了吗？ 再次使用 alert() 语句，或写信至Firebug's debug console。

一旦您缩小了问题的范围，请尝试将您的代码缩减为最简单的仍然失败的代码。然后向我们展示代码并准确告诉我们错误的症状是什么。

另一方面，我建议购买这本书：Javascript: The Deinitive Guide, 5th Edition by O'Reilly。它涵盖了很多很酷的东西，比如 AJAX 和闭包。它花费 50 美元，但绝对是一笔不错的投资，因为它以比您从免费网站获得的更加连贯的方式解释事物。

【讨论】：