三步：用php配置mysql连接

在本教程中，我们建立一个配置文件用于保存数据库配置信息，例如主机名、用户名、密码、数据库名称，等等。文件config.php如下：

以下为引用的内容：
<?php
// Configuration
$dbhost = 'localhost';
$dbuser = 'root';
$dbpass = '';
$dbname = 'microblog';
$conn = mysql_connect ($dbhost, $dbuser, $dbpass) or die ('I cannot connect to the database because: ' . mysql_error());
mysql_select_db ($dbname);
?>
 

在代码中，mysql_connect（）函数用于丽娜接mysql数据库服务器。该函数有三个参数：主机名、用户名和密码。连接数据库后，我们可以用函数mysql_select_db（）查询活动的数据库，mysql_select_db（）需要一个参数，数据库名称。

第四步：实现信息发布功能

发布和显示消息是本教程的核心功能。我们将使用jquery库来实现它。首先我们应在html页面中包含jquery库。

<script type=“text/javascript” src=“js/jquery.js”></script>

所有jquery代码将被保存在main.js中，也应被包含在html页面：

<script type=“text/javascript” src=“js/main.js”></script>

在main.js中，我们应在编写jquery代码之前定义函数$（document）.ready（）。

$(document).ready(function(){
    //Place your codes here
});

实现发布新消息的ajax代码如下：

$(document).ready(function(){
    $.post("backend.php",{
        message: $("#message").val(),
        action: "postmsg"
            }, function(xml) {
                $("#comm").html("The latest Update: ");
                addMessages(xml);
            });
        return false;
    });
});
第五步：实现backend.php

backend.php文件用于接收前台的ajax请求，并返回xml格式的消息。其内容如下：

以下为引用的内容：
<?php
include("config.php");
header("Content-type: text/xml");
header("Cache-Control: no-cache");
foreach($_POST as $key => $value)
{
    $$key = mysql_real_escape_string($value);
}

if(@$action == "postmsg")
{
    // prepare the query string
    $query = "INSERT INTO message (message, date) VALUES ('$message', current_date)";
mysql_query($query) or die('Error, query failed. ' . mysql_error());
}

echo "<?xml version=\"1.0\"?> ";
echo "\t<message> ";
echo "\t\t<text>$message</text> ";
echo "\t</message> ";
?>
 

前台会从backend.php得到xml相应，并解码xml文件显示在页面上。

第六步：用样式显示消息

用户每次载入页面，我们应在页面上显示旧的消息。因此，我们需要查询数据库以便得到旧的消息并显示他们：

以下为引用的内容：
<div id="messagewindow">
<?php
include("config.php");
// prepare the query string
$query = "SELECT id, message, DATE_FORMAT(date, '%Y-%m-%d') ".
"FROM message ".
"ORDER BY id DESC ";
// execute the query
$result = mysql_query($query) or die('Error, query failed. ' . mysql_error());

// if the guestbook is empty show a message
if(mysql_num_rows($result) == 0)
{
echo "<h3 id='comm'>No updates now.</h3>";
echo "<ul id='comments'></ul>";
}
else
{
echo "<h3 id='comm'>The latest Update: </h3>" .
"<ul id='comments'>";

while($row = mysql_fetch_array($result))
{
list($id, $message, $date) = $row;

$message = htmlspecialchars($message);

$message = nl2br($message);

echo "<li><p class='info'>Added on $date :</p>";
echo "<div class='body'><p>" . $message . "</p>";
echo "</div></li>";
}
echo "</ul>";
}
?>
</div>
</div>
 

这些代码也位于在index.php中，同样，我们应用CSS定义一个漂亮的消息显示：

以下为引用的内容：
#comments, #comments li{
    margin:0;
    padding:0;
    list-style:none;
}
#comments li{
    padding:.5em;
    margin:.5em 0;
    background:#fcfcfc;
    border:1px solid #e1e1e1;
}
#comments li .info{
    padding:.2em 20px;
    background:#f1f1f1 url(images/ico_comments.gif) no-repeat 2px 50%;
    margin:0;
    color:#333;
    font-family:Georgia, "Times New Roman", Times, serif;
}
#comments li .body{
    padding:.5em 20px;
}
#commentForm {
    width: 550px;
}
#messagewindow {
    padding: 25px;
    overflow: auto;
}
 

在代码中，$post（）函数用于通过ajax发布信息到后台逻辑backend.php。返回数据是xml格式。addMessages（）函数用于不刷新页面显示新更新的消息。

function addMessages(xml) {
    message = $("message",xml).get(0);
    $("#comments").prepend("<li><p class='info'>Added on Today:</p>    <div class='body'>"
+ $("text",message).text() + "</div></li>");
    $("#message").val("").focus();

}

返回数据是xml格式，从firebug中，我们能看到：

下面是该xml文件的一个例子：

那么，在上面的jquery代码中，$（”text”，message）.text（）用于得到消息。请注意如何使用javascript/jquery得到xml文件节点的值。