我在sae上搭建了一个个人简历的页面： 有兴趣的可以访问 http://671coder.sinaapp.com/
在做下面一个简单的留言板的时候，卡了我很久，虽然完全没用过php。。但是还是最后勉强写出来了。。。
主页面html是这样写的：
<div class="row row-contact" id="contact_row" style="display: block"> <article> <h2 class="section-title">Contact Me</h2> <p>This block can be hidden and only shown in <a class="zoom-html">a popup</a>.</p> <div class="wrap-contact-form"> <form id="contacts" class="contact-form" action="/db/submitform.php" method="post"> <table class="info"> <tr> <th><label for="contact_name">Name</label></th> <td><input type="text" class="input-text" name="contact_name" id="contact_name" value="" maxlength="10"></td> </tr> <!-- start spam protection <tr class="spam-protection"> <th><label>E-mail</label></th> <td><input type="text" name="email" value=""></td> </tr> end --> <tr> <th><label for="contact_code">Security code</label></th> <td><input type="text" class="input-text" name="contact_code" id="contact_code" maxlength="4"></td> </tr> <tr> <th><label for="contact_message">Your Message</label></th> <td><textarea id="contact_message" name="contact_message" maxlength="200"></textarea></td> </tr> <tr> <th></th> <td> <input type="submit" class="input-submit" name="contact_send" value="Send"> <div class="on-success"> Thank You. The message was sent. </div> <!-- <div class="on-error"> A technical error occured. Message was not delivered. Please contact me over e-mail. </div> --> </td> </tr> </table> </form> </div> </article> </div>
验证码功能暂时还没有实现。。。
后台的php是这样写的：
<?php $name = $_POST['contact_name']; $message = $_POST['contact_message']; if (strlen($name) == 0 || strlen($message) == 0) { ?><script> alert("Sorry, your name and your message can not be empty."); window.history.back(-1); </script><? } $m_notchar="$#@!%&*?<>"; $mysql = new SaeMysql(); $judge = true; for ($i=0; $i<10; $i++) { if (strpos($name, substr($m_notchar, $i, 1)) || strpos($message, substr($m_notchar, $i, 1))) $judge = false; } if( $mysql->errno() != 0 ) { die( "Error:" . $mysql->errmsg() ); } else if (!$judge) { ?><script>alert("Sorry, your message has illegal characters, please re-enter checked.");</script><? } else { $sql = "INSERT INTO Message (MName, MText) VALUES ('$name', '$message')"; $mysql->runSql( $sql ); ?><script>alert("Thank you for your message!");</script><? } $mysql->closeDb(); ?><script>window.history.back(-1);</script>然后最后显示留言板是这么写的：
<html> <head> <meta charset="utf-8"> <title>My messages</title> <link href=”http://fonts.googleapis.com/css?family=Reenie+Beanie:regular” rel=”stylesheet” type=”text/css”> <style type="text/css"> *{ margin:0; padding:0; } body{ font-family: arial,sans-serif; font-size:100%; margin:3em; background:#666; color:#fff; } h2,p{ font-size:100%； font-weight:normal; } ul,li{ list-style:none; } ul{ overflow: hidden; padding:3em; } ul li a{ text-decoration:none; color:#000; background:#ffc; display:block; height:10em; width:10em; padding:1em; -moz-box-shadow:5px 5px 7px rgba(33,33,33,1); -webkit-box-shadow: 5px 5px 7px rgba(33,33,33,.7); box-shadow: 5px 5px 7px rgba(33,33,33,.7); /*倾斜正方形*/ -webit-transform: rotate(-6deg); -o-transform: rotate(-6deg); -moz-transform: rotate(-6deg); /*添加鼠标放上时的平滑过渡*/ -moz-transition:-moz-transform .15s linear; -o-transition:-o-transform .15s linear; -webkit-transition:-webkit-transform .15s linear; } ul li{ margin:1em; float:left; } ul li h2{ font-size:140%; font-weight:bold; padding-bottom:10px; } ul li p{ font-family:"Reenie Beanie",arial,sans-serif,微软雅黑; font-size:110%; } ul li:nth-child(even) a{ -o-transform: rotate(4deg); -webkit-transform: rotate(4deg); -moz-transform: rotate(4deg); position:relative; top:5px; background:#cfc ; } ul li:nth-child(3n) a{ -o-transform: rotate(-3deg); -webkit-transform: rotate(-3deg); -moz-transform: rotate(-3deg); position:relative; top:-5px; background:#ccf ; } ul li:nth-child(5n) a{ -o-transform: rotate(5deg); -webkit-transform: rotate(5deg); -moz-transform: rotate(5deg); position:relative; top:-10px; } ul li a:hover, ul li a:focus{ -moz-box-shadow:10px 10px 7px rgba(0,0,0,.7); -webkit-box-shadow:10px 10px 7px rgba(0,0,0,.7); -box-shadow:10px 10px 7px rgba(0,0,0,.7); -webkit-transform:scale(1.25); -moz-transform:scale(1.25); -o-transform:scale(1.25); position:relative; z-index:5; } </style> </head> <body> <?php $link=mysql_connect(SAE_MYSQL_HOST_M.':'.SAE_MYSQL_PORT,SAE_MYSQL_USER,SAE_MYSQL_PASS); if(!$link)die('could not connect'.mysql_error()); mysql_select_db(SAE_MYSQL_DB,$link); $query = "select * from app_671coder.Message"; $result = mysql_query( $query ); if ($result) {?> <ul><? echo "<p><font size=7>671coder's message:</font></p><br><p></p>"; while ($r = mysql_fetch_array($result)) { $idx = $r["MId"]; $user = $r["MName"]; $text = $r["MText"];?> <li> <a href ="#"> <h2><?=$user?>:</h2> <p><?=$text?></p> </a> </li><?php }?> </ul><? } else { echo "No data."; } //mysql_free_result($result); //$mysql->closeDb();?> </body> </html>怎么样！感觉上很炫吧！
数据库的话想必大家都知道是怎么设计的了吧？！