如何用jquery建立类Twitter站点－站长资讯网info110.com

第五步：实现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\"?>\n";
echo "\t<message>\n";
echo "\t\t<text>$message</text>\n";
echo "\t</message>\n";
?>

前台会从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;
}

现在，在我们添加一个新的更新后，页面看起来如下：

.
分页: [1] [2] [3] [4] [5]

上一篇:如何使用PHP服务端代理抓取网页内容
下一篇:Linux下采用snmp监控配置说明

TAG: TWITTER JQUERY 站点

搜索

如何用jquery建立类Twitter站点