本篇实现发表博客。

八、发表博客

(1)、界面实现file.php

<tr> 
    <td colSpan=3 valign="baseline" style="BACKGROUND-IMAGE: url( images/bg.jpg); VERTICAL-ALIGN: middle; HEIGHT: 450px; TEXT-ALIGN: center">
    <table width="100%" height="100%"  border="0" cellpadding="0" cellspacing="0">
    <tr>
        <td height="451" align="center" valign="top">
        <!-- 发表文章 -->
        <table width="640"  border="0" cellpadding="0" cellspacing="0">
        <tr>
            <td width="613" height="223" align="center"><br>
<span style="white-space:pre"> </span><table width="500" border="0" cellpadding="0" cellspacing="0">
            <tr>
            <td>
<span style="white-space:pre"> </span>    <form  name="myform" method="post" action="check_file.php?flag=<?php echo $flag; if($flag){echo "&id=".$_GET['file_id'];}?>">
<span style="white-space:pre"> </span>    <table width="630" border="1" cellpadding="3" cellspacing="1" bordercolor="#D6E7A5">
            <tr>
                <td class="i_table" colspan="2"> <span class="tableBorder_LTR">加入博客文章</span></td>
            </tr>
            <tr>
                <td valign="top" align="right" width="14%">博客主题:<br></td>
                <td width="86%"><input name="txt_title" type="text" id="txt_title" size="68" value="<?php if($flag){echo $title;}?>"></td>
            </tr>
            <tr>
                <td align="right" width="14%">文字编辑区:</td>
                <td width="86%">
                    <img src=" images/UBB/B.gif" width="21" height="20" onClick="bold()">&nbsp;
                    <img src=" images/UBB/I.gif" width="21" height="20" onClick="italicize()">&nbsp;
                    <img src=" images/UBB/U.gif" width="21" height="20" onClick="underline()">
<span style="white-space:pre"> </span>            字体
                    <select name="font" class="wenbenkuang" id="font" onChange="showfont(this.options[this.selectedIndex].value)">
                        <option value="宋体" selected>宋体</option>
                        <option value="黑体">黑体</option>
                        <option value="隶书">隶书</option>
                        <option value="楷体">楷体</option>
                    </select>
                                                    字号<span class="pt9">
                    <select name=size class="wenbenkuang" onChange="showsize(this.options[this.selectedIndex].value)">
                         <option value=1>1</option>
                         <option value=2>2</option>
                         <option value=3 selected>3</option>
                         <option value=4>4</option>
                         <option value="5">5</option>
                         <option value="6">6</option>
                         <option value="7">7</option>
                    </select>
                                                    颜色
                    <select onChange="showcolor(this.options[this.selectedIndex].value)" name="color" size="1" class="wenbenkuang" id="select">
                          <option selected>默认颜色</option>
                          <option style="color:#FF0000" value="#FF0000">红色热情</option>
                          <option style="color:#0000FF" value="#0000ff">蓝色开朗</option>
                          <option style="color:#ff00ff" value="#ff00ff">桃色浪漫</option>
                          <option style="color:#009900" value="#009900">绿色青春</option>
                          <option style="color:#009999" value="#009999">青色清爽</option>
                          <option style="color:#990099" value="#990099">紫色拘谨</option>
                          <option style="color:#990000" value="#990000">暗夜兴奋</option>
                          <option style="color:#000099" value="#000099">深蓝忧郁</option>
                          <option style="color:#999900" value="#999900">卡其制服</option>
                          <option style="color:#ff9900" value="#ff9900">镏金岁月</option>
                          <option style="color:#0099ff" value="#0099ff">湖波荡漾</option>
                          <option style="color:#9900ff" value="#9900ff">发亮蓝紫</option>
                          <option style="color:#ff0099" value="#ff0099">爱的暗示</option>
                          <option style="color:#006600" value="#006600">墨绿深沉</option>
                          <option style="color:#999999" value="#999999">烟雨蒙蒙</option>
                    </select></span>
                </td>
            </tr>
            <tr>
                <td align="right" width="14%">文章内容:</td>
                <td width="86%">
<span style="white-space:pre"> </span>    <div class="file"><span style="white-space:pre"> </span>  
<span style="white-space:pre"> </span><textarea name="file" cols="75" rows="20" id="file" style="border:0px;width:520px;"><?php if($flag){echo $content;}?></textarea>
<span style="white-space:pre"> </span>    </div> 
<span style="white-space:pre"> </span>    </td>
            </tr>
            <tr align="center">
                <td colspan="2"><input name="btn_tj" type="submit" id="btn_tj" value="提交" onClick="return check();">                          &nbsp;
                    <input name="btn_cx" type="reset" id="btn_cx" value="重写">
                </td>
            </tr>
            </table>
<span style="white-space:pre"> </span></form>
<span style="white-space:pre"> </span></td>
            </tr>
            </table>
            </td>
        </tr>
        </table>            
        </td>
    </tr>
    </table>
    </td> 
    </tr> 

编辑文章时各个选项使用js实现:UBBCode.js

helpstat = false;
basic = false;
function AddText(NewCode) {
document.all("file").value+=NewCode
}
function showsize(size) {
if (helpstat) {
alert("文字大小标记\n设置文字大小.\n可变范围 1 - 6.\n 1 为最小 6 为最大.\n使用方法: <size="+size+">这是 "+size+" 文字</size>");
} else if (basic) {
AddTxt="<font size="+size+"></font>";
AddText(AddTxt);
} else {
txt=prompt("大小 "+size,"文字");
if (txt!=null) {
AddTxt="<font size="+size+">"+txt;
AddText(AddTxt);
AddTxt="</font>";
AddText(AddTxt);
}
}
} function bold() {
if (helpstat) {
alert("加粗标记\n使文本加粗.\n使用方法: <b>这是加粗的文字</b>");
} else if (basic) {
AddTxt="<b></b>";
AddText(AddTxt);
} else {
txt=prompt("文字将被变粗.","请在这里输入要加粗的文字! ");
if (txt!=null) {
AddTxt="<b>"+txt;
AddText(AddTxt);
AddTxt="</b>";
AddText(AddTxt);
}
}
} function italicize() {
if (helpstat) {
alert("斜体标记\n使文本字体变为斜体.\n使用方法: <i>这是斜体字</i>");
} else if (basic) {
AddTxt="<i></i>";
AddText(AddTxt);
} else {
txt=prompt("文字将变斜体","请在这里输入要倾斜的文字!");
if (txt!=null) {
AddTxt="<i>"+txt;
AddText(AddTxt);
AddTxt="</i>";
AddText(AddTxt);
}
}
} function showcolor(color) {
if (helpstat) {
alert("颜色标记\n设置文本颜色. 不论什么颜色名都能够被使用.\n使用方法: <color="+color+">颜色要改变为"+color+"的文字</color>");
} else if (basic) {
AddTxt="<font color="+color+"></font>";
AddText(AddTxt);
} else {
txt=prompt("选择的颜色是: "+color,"请在这里输入要改变颜色的文字!");
if(txt!=null) {
AddTxt="<font color="+color+">"+txt;
AddText(AddTxt);
AddTxt="</font>";
AddText(AddTxt);
}
}
} function showfont(font) {
if (helpstat){
alert("字体标记\n给文字设置字体.\n使用方法: <font="+font+">改变文字字体为"+font+"</font>");
} else if (basic) {
AddTxt="<font face="+font+"></font>";
AddText(AddTxt);
} else {
txt=prompt("要设置字体的文字"+font,"请在这里输入要改变字体的文字!");
if (txt!=null) {
AddTxt="<font face="+font+">"+txt;
AddText(AddTxt);
AddTxt="</font>";
AddText(AddTxt);
}
}
} function underline() {
if (helpstat) {
alert("下划线标记\n给文字加下划线.\n使用方法: <u>要加下划线的文字</u>");
} else if (basic) {
AddTxt="<u></u>";
AddText(AddTxt);
} else {
txt=prompt("下划线文字.","文字");
if (txt!=null) {
AddTxt="<u>"+txt;
AddText(AddTxt);
AddTxt="</u>";
AddText(AddTxt);
}
}
}

(2)后台加入到数据库实现check_file.php

<?

php
session_start();
require_once 'Conn/SqlHelper.class.php';
$flag = $_GET['flag'];
if($flag!=2){
$txt_title = $_POST['txt_title'];
$file = $_POST['file'];
$author = $_SESSION['username'];
$date = date("Y-m-d H:i:s");
}
$sqlHelper = new SqlHelper();
if($flag==0){
$sql = "insert into tb_article(title,content,author,now)values('$txt_title','$file','$author','$date')";
}
$res = $sqlHelper->execute_dml($sql); if($res==1){
echo "<script>alert('操作成功。');</script>";
echo "<script>window.location.href='myfiles.php';</script>";
}else{
echo "<script>alert('对不起失败了! ');</script>";
echo "<script> history.go(-1);</script>";
}
?>

PHP经典项目案例-(一)博客管理系统5的更多相关文章

  1. SSM(Spring+Spring MVC+Mybatis)开发前台后功能完整的java开源博客管理系统

    项目描述 本项目通过SSM(SpringMVC+Mybatis+Spring)框架编写的一个人博客管理系统,使用hexo主题,以及MAVEN进行对项目管理,并且前端具有粒子和点击爱心效果.后端的页面框 ...

  2. Vue实战狗尾草博客管理系统第二章

    伙伴们出来啦,探讨各问题,关于项目中大量的表单,大家是怎么处理的? 本章主要内容如下:底层布局,路由配置,github仓库推送关联. 关联GitHub仓库 关联建立在github已创建账号的基础上 登 ...

  3. yii2实战教程之新手入门指南-简单博客管理系统

    作者:白狼 出处:http://www.manks.top/document/easy_blog_manage_system.html 本文版权归作者,欢迎转载,但未经作者同意必须保留此段声明,且在文 ...

  4. Django练习项目之搭建博客

    背景:自从今年回家过年后,来到公司给我转了试用,我的学习效率感觉不如从前,而且刚步入社会我总是想要怎么想明白想清楚一些事,这通常会花掉,消耗我大量的精力,因为我想把我的生活管理规划好了,而在it技术学 ...

  5. Node.js 从零开发 web server博客项目[express重构博客项目]

    web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...

  6. Node.js 从零开发 web server博客项目[koa2重构博客项目]

    web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...

  7. Oracle 0至6级锁的通俗解释及实验案例_ITPUB博客 http://blog.itpub.net/30126024/viewspace-2156232/

    Oracle 0至6级锁的通俗解释及实验案例_ITPUB博客 http://blog.itpub.net/30126024/viewspace-2156232/

  8. Vue实战狗尾草博客管理系统第一章

    Vue实战狗尾草博客后台管理系统第一章 这里准备采用的技术栈为:vue全家桶+element-ui 这里因为是后台管理系统,没有做SSR的必要.所以这里就采用前后端分离来昨晚这个项目~ 项目搭建 vu ...

  9. j2ee开源项目——IT学习者博客(itxxzblog v1.0)

    大家好,我是IT学习者-螃蟹,已经有近一周的时间没有更新文章了,作为回报,今天起将更新一个大件,也就是螃蟹还在进行中的IT学习者博客. IT学习者博客的初期设计已经完成,功能也已经完成了大半,具备了当 ...

随机推荐

  1. Educational Codeforces Round 13 B. The Same Calendar 水题

    B. The Same Calendar 题目连接: http://www.codeforces.com/contest/678/problem/B Description The girl Tayl ...

  2. [Linux] Ubuntu 18 LTS netplan 网络配置

    Ubuntu 18 LTS netplan 网络配置 今天装完 Ubuntu 18 LTS,配置网络时发现Ubuntu 18LTS ifupdown has been replaced by netp ...

  3. Android Path Time ScrollBar(Path 时间轴)

    版本号:1.0 日期:2014.4.22 版权:© 2014 kince 转载注明出处   这是仿Path2.0UI的一个demo的截图,我最早是在农民伯伯的这篇博客中看到的[Andorid X 项目 ...

  4. linux系统时间同步,硬件时钟和系统时间同步,时区的设置

           1.时间同步(手动): date -s "2015-07-15 22:13:30" hwclock --systohc   (表示系统时间同步到硬件时钟) hwclo ...

  5. maven打包出错: Failed to clean project: Failed to delete

    maven打包出错: Failed to clean project: Failed to delete 出现这种错误,通常是由于您已启动了另一个tomcat 进程,导致报错,关闭tomcat进程即可 ...

  6. 使用 soapUI 测试 REST 服务

    REST 服务介绍 REST(Representational State Transfer)是 Roy Fielding 博士在 2000 年提出的一种新的软件架构风格,它以资源(resource) ...

  7. POJ 3740 Dancing Links

    Dancing Links学习:http://www.cnblogs.com/steady/archive/2011/03/15/1984791.html 以及图文学习:http://www.cnbl ...

  8. MySQL面试题集锦

    1. 如何设计一个高并发的系统 ① 数据库的优化,包括合理的事务隔离级别.SQL语句优化.索引的优化 ② 使用缓存,尽量减少数据库 IO ③ 分布式数据库.分布式缓存 ④ 服务器的负载均衡 2. 锁的 ...

  9. [翻译] FreeStreamer 在线流媒体播放

    FreeStreamer https://github.com/muhku/FreeStreamer Introduction FreeStreamer is an audio player engi ...

  10. spring IOC的常见几种以来注入的方式

    在spring ioc中有三种依赖注入,分别是:a.接口注入:b.setter方法注入:c.构造方法注入: 接口注入: public class ClassA { private InterfaceB ...