您的位置: 首页  >  文章  >  在线小说网站的设计与实现（附源码）

在线小说网站的设计与实现（附源码）

分类: 文章 • 2024-06-24 11:48:46

最近在做一个课程设计，在线小说网站的设计，以下是课题要求，需要项目练手的童鞋可以试试身手。

由于最近新学了JavaEE，所以采用了jsp+servlet来写，前端部分用了少量的js和jQuery处理，数据库用了MySQL，开发平台是myeclipse。

发布文章时直接插入数据库会没有分段，这里的解决办法是引入第三方工具wangEditor（wangEditor 是一款基于JavaScript和css开发的html富文本编辑器，开源免费。产品第一版发布于2014年11月。关于该编辑器：http://www.kancloud.cn/wangfupeng/wangeditor2/113961）

在线小说网站的设计与实现（附源码）

首先数据库的设计结构：

[sql] view plain copy
 print?
  1. /*  
  2. Navicat MySQL Data Transfer  
  3.   
  4. Source Server         : blog  
  5. Source Server Version : 50528  
  6. Source Host           : localhost:3306  
  7. Source Database       : novel  
  8.   
  9. Target Server Type    : MYSQL  
  10. Target Server Version : 50528  
  11. File Encoding         : 65001  
  12.   
  13. Date: 2016-12-31 16:04:07  
  14. */  
  15.   
  16. SET FOREIGN_KEY_CHECKS=0;  
  17.   
  18. -- ----------------------------  
  19. -- Table structure for admin  
  20. -- ----------------------------  
  21. DROP TABLE IF EXISTS `admin`;  
  22. CREATE TABLE `admin` (  
  23.   `id` int(11) NOT NULL AUTO_INCREMENT,  
  24.   `adminName` varchar(255) NOT NULL,  
  25.   `adminPassword` varchar(255) NOT NULL,  
  26.   PRIMARY KEY (`id`)  
  27. ) ENGINE=InnoDB AUTO_INCREMENT=2 DEFAULT CHARSET=utf8;  
  28.   
  29. -- ----------------------------  
  30. -- Table structure for author  
  31. -- ----------------------------  
  32. DROP TABLE IF EXISTS `author`;  
  33. CREATE TABLE `author` (  
  34.   `id` int(11) NOT NULL AUTO_INCREMENT,  
  35.   `authorName` varchar(255) NOT NULL,  
  36.   `authorPassword` varchar(255) NOT NULL,  
  37.   `authorEmail` varchar(255) DEFAULT NULL,  
  38.   PRIMARY KEY (`id`)  
  39. ) ENGINE=InnoDB AUTO_INCREMENT=22 DEFAULT CHARSET=utf8;  
  40.   
  41. -- ----------------------------  
  42. -- Table structure for comment  
  43. -- ----------------------------  
  44. DROP TABLE IF EXISTS `comment`;  
  45. CREATE TABLE `comment` (  
  46.   `id` int(11) NOT NULL AUTO_INCREMENT,  
  47.   `context` text,  
  48.   `createdTime` datetime DEFAULT NULL,  
  49.   `readerName` varchar(255) DEFAULT NULL,  
  50.   `novelId` int(11) DEFAULT NULL,  
  51.   PRIMARY KEY (`id`)  
  52. ) ENGINE=InnoDB AUTO_INCREMENT=67 DEFAULT CHARSET=utf8;  
  53.   
  54. -- ----------------------------  
  55. -- Table structure for genre  
  56. -- ----------------------------  
  57. DROP TABLE IF EXISTS `genre`;  
  58. CREATE TABLE `genre` (  
  59.   `id` int(11) NOT NULL AUTO_INCREMENT,  
  60.   `name` varchar(255) DEFAULT NULL,  
  61.   `sort` int(11) DEFAULT NULL,  
  62.   PRIMARY KEY (`id`)  
  63. ) ENGINE=InnoDB AUTO_INCREMENT=14 DEFAULT CHARSET=utf8;  
  64.   
  65. -- ----------------------------  
  66. -- Table structure for novel  
  67. -- ----------------------------  
  68. DROP TABLE IF EXISTS `novel`;  
  69. CREATE TABLE `novel` (  
  70.   `id` int(11) NOT NULL AUTO_INCREMENT,  
  71.   `title` varchar(255) NOT NULL,  
  72.   `context` text NOT NULL,  
  73.   `createdTime` datetime DEFAULT NULL,  
  74.   `genreId` int(11) DEFAULT NULL,  
  75.   `voteNumber` int(11) NOT NULL,  
  76.   PRIMARY KEY (`id`)  
  77. ) ENGINE=InnoDB AUTO_INCREMENT=160 DEFAULT CHARSET=utf8;  
  78.   
  79. -- ----------------------------  
  80. -- Table structure for reader  
  81. -- ----------------------------  
  82. DROP TABLE IF EXISTS `reader`;  
  83. CREATE TABLE `reader` (  
  84.   `id` int(11) NOT NULL AUTO_INCREMENT,  
  85.   `readerName` varchar(255) NOT NULL,  
  86.   `readerPassword` varchar(255) NOT NULL,  
  87.   `readerEmail` varchar(255) DEFAULT NULL,  
  88.   PRIMARY KEY (`id`)  
  89. ) ENGINE=InnoDB AUTO_INCREMENT=22 DEFAULT CHARSET=utf8;  

项目的大致结构如图：

在线小说网站的设计与实现（附源码）

由于功能有点多，这里先介绍后台的实现，管理后台和前台互不交涉。

登录界面

在线小说网站的设计与实现（附源码）


后台主页：

1，小说管理

在线小说网站的设计与实现（附源码）

2，作者管理：

在线小说网站的设计与实现（附源码）

3，增加分类

在线小说网站的设计与实现（附源码）

后台其他导航页面基本雷同，这里不做一一介绍。

后台管理员登录处理代码：

[java] view plain copy
 print?
  1. public class Admin {  
  2.     Conn conn=new Conn();  
  3.     /** 
  4.      * 判断登陆用户是否合法 
  5.      * @param adminName 
  6.      * @param adminPassword 
  7.      * @return 
  8.      * @throws SQLException 
  9.      */  
  10.     public boolean isExist(String adminName,String adminPassword)throws SQLException{  
  11.         boolean result=false;  
  12.         AdminInfo ainfo=new AdminInfo();  
  13.         String sql="select * from admin a where adminName='"+adminName+"'and adminPassword='"+adminPassword+"'";  
  14.         System.out.println(sql);  
  15.         ResultSet rs=conn.executeQuery(sql);  
  16.         if(rs.next()){  
  17.             ainfo.setAdminName(rs.getString("adminName"));  
  18.             ainfo.setAdminPassword(rs.getString("adminPassword"));  
  19.             result=true;  
  20.         }  
  21.         conn.close();  
  22.         return result;  
  23.     }  
  24. }  

小说展示，管理，增加，删除，更新的代码处理：

[java] view plain copy
 print?
  1. public class Novel {  
  2.     Conn conn=new Conn();  
  3.     /** 
  4.      * 获取小说列表 
  5.      * @param keyword 
  6.      * @return 
  7.      * @throws SQLException 
  8.      */  
  9.       
  10.     public List<NovelInfo>getList(String keyword)throws SQLException{  
  11.         List<NovelInfo> list=new ArrayList<NovelInfo>();  
  12.   
  13.         String sql="select n.*,g.name as genreName from novel n left join genre g on n.genreId=g.id";  
  14.         if(DataValidator.isNullOrEmpty(keyword)){  
  15.             sql=sql+ " order by id desc";  
  16.         }else{  
  17.             sql=sql+" where n.title like '%"+keyword+"%' order by id desc";  
  18.         }  
  19.         ResultSet rs=conn.executeQuery(sql);  
  20.         while(rs.next()){  
  21.             NovelInfo ninfo=new NovelInfo();  
  22.             ninfo.setId(rs.getInt("Id"));  
  23.             ninfo.setTitle(rs.getString("Title"));  
  24.             ninfo.setContext(rs.getString("Context"));  
  25.             ninfo.setCreatedTime(rs.getDate("CreatedTime"));  
  26.             ninfo.setGenreId(rs.getInt("GenreId"));  
  27.             ninfo.setGenreName(rs.getString("genreName"));  
  28.             ninfo.setVoteNumber(rs.getInt("voteNumber"));  
  29.             list.add(ninfo);  
  30.         }  
  31.         conn.close();  
  32.         return list;  
  33.     }  
  34.     /** 
  35.      * 获取某分类下的小说列表 
  36.      * @param classId 
  37.      * @return 
  38.      * @throws SQLException 
  39.      */  
  40.     public List<NovelInfo> getListBygenreId(int genreId) throws SQLException{  
  41.         List<NovelInfo> list=new ArrayList<NovelInfo>();  
  42.         String sql="select n.*,g.name as genreName from novel n left join genre g on n.genreId=g.id"  
  43.                 + " where n.genreId="+genreId+" order by id desc";  
  44.         ResultSet rs=conn.executeQuery(sql);  
  45.         while(rs.next()){  
  46.             NovelInfo info=new NovelInfo();  
  47.             info.setId(rs.getInt("Id"));  
  48.             info.setTitle(rs.getString("Title"));  
  49.             info.setContext(rs.getString("Context"));  
  50.             info.setCreatedTime(rs.getDate("CreatedTime"));  
  51.             info.setGenreId(rs.getInt("GenreId"));  
  52.             info.setGenreName(rs.getString("genreName"));  
  53.             info.setVoteNumber(rs.getInt("voteNumber"));  
  54.             list.add(info);  
  55.         }  
  56.         conn.close();  
  57.         return list;  
  58.     }  
  59.     /** 
  60.      * 根据ID获取小说 
  61.      * @param id 
  62.      * @return 
  63.      * @throws SQLException 
  64.      */  
  65.     public NovelInfo getNovelInfo(int id) throws SQLException{  
  66.         NovelInfo info=new NovelInfo();  
  67.         String sql="select n.*,g.name as genreName from novel n left join genre g on n.genreId=g.id where n.id="+id+"";  
  68.         ResultSet rs=conn.executeQuery(sql);  
  69.         while(rs.next()){  
  70.             info.setId(rs.getInt("Id"));  
  71.             info.setTitle(rs.getString("Title"));  
  72.             info.setContext(rs.getString("Context"));  
  73.             info.setCreatedTime(rs.getDate("CreatedTime"));  
  74.             info.setGenreId(rs.getInt("GenreId"));  
  75.             info.setGenreName(rs.getString("genreName"));  
  76.             info.setVoteNumber(rs.getInt("voteNumber"));  
  77.         }  
  78.         conn.close();  
  79.         return info;  
  80.     }  
  81.     /** 
  82.      * 写入新小说 
  83.      *  
  84.      * @param info 
  85.      * @return 
  86.      */  
  87.     public int insert(NovelInfo info){  
  88.         String sql="insert into novel(title,conText,createdTime,genreId,voteNumber)values";  
  89.         sql=sql+"('"+info.getTitle()+"','"+info.getContext()+"',now(),'"+info.getGenreId()+"',"+info.getVoteNumber()+")";  
  90.         int result=0;  
  91.         System.out.println(sql);  
  92.         result=conn.executeUpdate(sql);  
  93.         conn.close();  
  94.         return result;  
  95.     }  
  96.   
  97.     /** 
  98.      *更新小说 
  99.      * @param info 
  100.      * @return 
  101.      */  
  102.     public int update(NovelInfo info){  
  103.         String sql="update novel set "+" Title='"+info.getTitle()+"',Context='"+info.getContext()+"',"  
  104.                 + "genreId='"+info.getGenreId()+"'where id="+info.getId()+"";  
  105.         int result=0;  
  106.         System.out.println(sql);  
  107.         result=conn.executeUpdate(sql);  
  108.         conn.close();  
  109.         return result;  
  110.     }  
  111.     /** 
  112.      * 删除小说 
  113.      * @param id 
  114.      * @return 
  115.      */  
  116.       
  117.     public int delete(int id){  
  118.         String sql="delete from novel where id="+id+"";  
  119.         int result=0;  
  120.         result=conn.executeUpdate(sql);  
  121.         conn.close();  
  122.         return result;  
  123.     }  
  124.     /** 
  125.      * 增加票数 
  126.      * @return 
  127.      */  
  128.     public int addVote(int num){  
  129.           
  130.         return 0;  
  131.           
  132.     }  
  133. }  

小说评论展示，管理，增加，删除，更新的代码处理：

[java] view plain copy
 print?
  1. public class Comment {  
  2.     Conn conn=new Conn();  
  3.     /** 
  4.      * 获取评论列表 
  5.      * @return 
  6.      * @throws SQLException 
  7.      */  
  8.     public List<CommentInfo> getList() throws SQLException{  
  9.         List<CommentInfo> list=new ArrayList<CommentInfo>();  
  10.         String sql="select * from comment order by id desc";  
  11.         ResultSet rs=conn.executeQuery(sql);  
  12.         while(rs.next()){  
  13.             CommentInfo info=new CommentInfo();  
  14.             info.setId(rs.getInt("Id"));  
  15.             info.setContext(rs.getString("Context"));  
  16.             info.setNovelId(rs.getInt("NovelId"));  
  17.             info.setCreatedTime(rs.getDate("CreatedTime"));  
  18.             info.setReaderName(rs.getString("ReaderName"));  
  19.             list.add(info);  
  20.             System.out.print(list);  
  21.         }  
  22.         conn.close();  
  23.         return list;  
  24.     }  
  25.     /** 
  26.      *  
  27.      * @param classId 
  28.      * @return 
  29.      * @throws SQLException 
  30.      */  
  31.     public CommentInfo getCommentInfo(int id)throws SQLException{  
  32.         CommentInfo info=new CommentInfo();  
  33.         String sql="select * from Comment c where id="+id+"";  
  34.         ResultSet rs=conn.executeQuery(sql);  
  35.         while(rs.next()){  
  36.             info.setId(rs.getInt("Id"));  
  37.             info.setContext(rs.getString("Context"));  
  38.             info.setNovelId(rs.getInt("NovelId"));  
  39.             info.setCreatedTime(rs.getDate("CreatedTime"));  
  40.             info.setReaderName(rs.getString("ReaderName"));  
  41.         }  
  42.         conn.close();  
  43.         return info;  
  44.           
  45.     }  
  46.     /** 
  47.      *  获取某小说下的评论 
  48.      * @param id 
  49.      * @return 
  50.      * @throws SQLException 
  51.      */  
  52.     public List<CommentInfo> getListByNovelId(int novelid) throws SQLException{  
  53.         List<CommentInfo> list=new ArrayList<CommentInfo>();  
  54.         String sql="select * from comment  where novelId="+novelid+" order by id desc";  
  55.         ResultSet rs=conn.executeQuery(sql);  
  56.         while(rs.next()){  
  57.             CommentInfo info=new CommentInfo();  
  58.             info.setId(rs.getInt("Id"));  
  59.             info.setContext(rs.getString("Context"));  
  60.             info.setNovelId(rs.getInt("NovelId"));  
  61.             info.setCreatedTime(rs.getDate("CreatedTime"));  
  62.             info.setReaderName(rs.getString("ReaderName"));  
  63.             list.add(info);  
  64.         }  
  65.         conn.close();  
  66.         return list;  
  67.     }  
  68.     /** 
  69.      * 插入评论 
  70.      * @param info 
  71.      * @return 
  72.      */  
  73.     public int insert(CommentInfo info){  
  74.         String sql="insert into Comment(Context,CreatedTime,readerName,novelId)values";  
  75.         sql=sql+"('"+info.getContext()+"',now(),'"+info.getReaderName()+"',"+info.getNovelId()+")";  
  76.         int result=0;  
  77.         System.out.println(sql);  
  78.         result=conn.executeUpdate(sql);  
  79.         conn.close();  
  80.         return result;  
  81.     }  
  82.     /** 
  83.      * 更新评论 
  84.      * @param info 
  85.      * @return 
  86.      */  
  87.     public int update(CommentInfo info){  
  88.         String sql="update Comment set "+" Context='"+info.getContext()+"',novelId='"+info.getNovelId()+"',"  
  89.                 + "CreatedTime='"+info.getCreatedTime()+"',readerName='"+info.getReaderName()+"' where id="+info.getId()+"";  
  90.         int result=0;  
  91.         System.out.println(sql);  
  92.         result=conn.executeUpdate(sql);  
  93.         conn.close();  
  94.         return result;  
  95.     }  
  96.     /** 
  97.      * 删除评论 
  98.      * @param id 
  99.      * @return 
  100.      */  
  101.     public int delete(int id){  
  102.         String sql="delete from Comment where id="+id+"";  
  103.         int result=0;  
  104.         result=conn.executeUpdate(sql);  
  105.         System.out.println(sql);  
  106.         conn.close();  
  107.         return result;  
  108.     }  
  109. }  


小说分类展示，更新，增加，删除的代码处理：


[java] view plain copy
 print?
  1. public class Genre {  
  2.     Conn conn=new Conn();  
  3.     /** 
  4.      * 获取分类列表 
  5.      * @return 
  6.      * @throws SQLException 
  7.      */  
  8.     public List<GenreInfo> getList()throws SQLException{  
  9.         List<GenreInfo> list=new ArrayList<GenreInfo>();  
  10.         String sql="select * from genre order by Sort asc";  
  11.         ResultSet rs=conn.executeQuery(sql);  
  12.         while(rs.next()){  
  13.             GenreInfo info=new GenreInfo();  
  14.             info.setId(rs.getInt("Id"));  
  15.             info.setName(rs.getString("Name"));  
  16.             info.setSort(rs.getInt("Sort"));  
  17.             list.add(info);  
  18.     }  
  19.         conn.close();  
  20.         return list;  
  21.     }  
  22.     /** 
  23.      *  
  24.      * @param id 
  25.      * @return 
  26.      * @throws SQLException 
  27.      */  
  28.     public GenreInfo getGenreInfo(int id)throws SQLException{  
  29.         GenreInfo info=new GenreInfo();  
  30.         String sql="select * from genre g where id="+id+"";  
  31.         ResultSet rs=conn.executeQuery(sql);  
  32.         while(rs.next()){  
  33.             info.setId(rs.getInt("Id"));  
  34.             info.setName(rs.getString("Name"));  
  35.             info.setSort(rs.getInt("Sort"));  
  36.     }  
  37.         conn.close();  
  38.         return info;  
  39.     }  
  40.     /** 
  41.      * 增加分类 
  42.      * @param info 
  43.      * @return 
  44.      */  
  45.     public int insert(GenreInfo info){  
  46.         String sql="insert into genre(Name,Sort) values";  
  47.         sql=sql+"('"+info.getName()+"','"+info.getSort()+"')";  
  48.         int result=0;  
  49.         result=conn.executeUpdate(sql);  
  50.         conn.close();  
  51.         return result;  
  52.     }  
  53.     /** 
  54.      * 更新分类 
  55.      *  
  56.      * @param info 
  57.      * @return 
  58.      */  
  59.     public int update(GenreInfo info){  
  60.         String sql="update genre set "+" Name='"+info.getName()+"',Sort= '"+info.getSort()+"' where id="+info.getId()+"";  
  61.         int result=0;  
  62.         result=conn.executeUpdate(sql);  
  63.         return result;  
  64.           
  65.     }  
  66.     public int delete(int id){  
  67.         String sql="delete from genre where id="+id+"";  
  68.         int result=0;  
  69.         result=conn.executeUpdate(sql);  
  70.         conn.close();  
  71.         return result;  
  72.     }  
  73.       
  74. }  

前台主要页面展示：（略丑）

在线小说网站的设计与实现（附源码）

作者发布小说界面：

在线小说网站的设计与实现（附源码）

读者评论界面：

在线小说网站的设计与实现（附源码）

为小说投票，投票功能的前端设计代码：

[javascript] view plain copy
 print?
  1. function getElemensByClassName(className){  // 通过class获取  
  2.   var classArr = new Array();  
  3.   var tags = document.getElementsByTagName("*"); //获取所有节点  
  4.   for(var item in tags){   
  5.     if(tags[item].nodeType == 1){   
  6.     if(tags[item].getAttribute("class") == className){   
  7.       classArr.push(tags[item]); //收集class匹配的节点  
  8.     }  
  9.   }  
  10. }  
  11.   return classArr;  
  12. }  
  13.    
  14. function delete_FF(element){  // 在FireFox中删除子节点为空的元素  
  15.   var childs = element.childNodes;  
  16.   for(var i=0;i<childs.length;i++){   
  17.     var pattern = /\s/; //模式匹配，内容为空  
  18.     if(childs[i].nodeName == "#text" && pattern.test(childs[i].nodeValue)){  //处理  
  19.       //alert(childs[i].nodeName);  
  20.       element.removeChild(childs[i]); //删除FF中获取的空节点  
  21.     }  
  22.   }  
  23. }  
  24. function $(obj){return document.getElementById(obj);}  
  25. window.onload = function(){   
  26.     onload1();  
  27.     onload2();  
  28. };  
  29. function onload2(){  
  30.   var persons = getElemensByClassName("person");  
  31. //  alert(persons);  
  32.   for(var item in persons){  //遍历所有person，为它们绑定投票事件  
  33.     (function(_item){    //匿名函数传入item, 防止因作用域问题导致item总为最后一个  
  34.     delete_FF(persons[_item]); //出去FF中空行代表的子节点  
  35.     persons[_item].setAttribute("id","person"+(parseInt(_item)+1)); //赋上id  
  36.    
  37.     var childs = persons[_item].childNodes;  
  38.     for(var i = 0;i<childs.length;i++){   
  39.       //alert(childs[i].nodeName);  
  40.       if(childs[i].nodeName == "BUTTON"){  //点击按钮投票  
  41.         var oButton = childs[i];  
  42.       }  
  43.       if(childs[i].nodeName == "P"){  //投票结果更新  
  44.         var oP = childs[i];  
  45.         var oSpan = oP.getElementsByTagName("span")[0];  
  46.       }  
  47.     }  
  48.     if(oButton != null){  
  49.     oButton.onclick = function(){  //事件绑定  
  50.       var num = oSpan.innerHTML; //获取票数  
  51.       oSpan.innerHTML = (++num); //票数更新  
  52.                     // 这时一般我们可能就需要把这个票数num传送给服务器保存，更新时也是和服务器中的num同步  
  53.       this.setAttribute("disabled","true"); // 一般只能投票一次的吧  
  54.       alert("投票成功，谢谢您的支持");  
  55.     };  
  56.   }  
  57. })(item); // 传入各项person  
  58.   }  
  59. }  

小说发布的实现细节，引入了wangEditor：

[plain] view plain copy
 print?
  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>  
  2. <%@page import="org.common.*" %>  
  3. <%@page import="org.model.*" %>  
  4. <%@page import="org.dal.*" %>  
  5. <%  
  6. String path = request.getContextPath();  
  7. String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";  
  8. %>  
  9. <!-- 发布小说 -->  
  10. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  11. <html>  
  12.   <head>  
  13.     <base href="<%=basePath%>">  
  14.     <title>小说编辑发布界面</title>  
  15.     <script type="text/javascript" src="js/jquery-1.10.1.js"></script>  
  16.     <link rel="stylesheet" type="text/css" href="css/edit.css">  
  17.     <link rel="stylesheet" type="text/css" href="css/wangEditor.min.css">  
  18.     <script type="text/javascript" src="js/wangEditor.min.js"></script>  
  19.   </head>  
  20.    
  21.   <body>  
  22. <%   
  23.     request.setCharacterEncoding("utf-8");  
  24.     Genre cls=new Genre();  
  25.     List<GenreInfo>list=cls.getList();  
  26.     Novel novel=new Novel();  
  27.     NovelInfo ninfo=new NovelInfo();  
  28.     if("fabu".equals(request.getParameter("action")))  
  29. {     
  30.     ninfo.setTitle(request.getParameter("txtTitle"));  
  31.     ninfo.setContext(request.getParameter("content"));  
  32.     ninfo.setGenreId(DataConverter.toInt(request.getParameter("selClass")));  
  33.     novel.insert(ninfo);  
  34.     out.println("<script>alert('发布成功');</script>");  
  35. }  
  36. %>     
  37. <div class="header">    
  38.     <h2>当前位置：小说编辑</h2>  
  39. </div>  
  40.   <a class="wel">欢迎您：<%=Utilty.readCookie(request, "user")%></a>  
  41.   <div class="context" >  
  42.     <form id="form1" name="form1" method="post"   
  43.     action="novel/novel-edit.jsp?action=fabu" onsubmit="return check(this)">  
  44.         <table>  
  45.             <tr>  
  46.             <td>小说所属分类:</td>  
  47.             <td>  
  48.             <select name="selClass" id="selClass" style="width:300px;height:30px;">  
  49.                 <%  
  50.                     for(GenreInfo cinfo:list){  
  51.                 %>  
  52.                 <option value="<%=cinfo.getId() %>">  
  53.                 <%if(cinfo.getId()==ninfo.getId()) %>  
  54.                 <%=cinfo.getName() %></option>  
  55.                 <%  
  56.                     }  
  57.                 %>  
  58.             </select>  
  59.             </td>  
  60.             </tr>  
  61.             <tr>  
  62.             <td>小  说   标   题:</td>  
  63.             <td><input type="text" name="txtTitle" id="txtTitle" style="width:500px;height:30px"/></td>  
  64.             </tr>  
  65.               
  66.             <tr>  
  67.                 <td>小  说   内   容:</td>  
  68.                  <td style="width:1000px;"><textarea rows="25" name="content" id="content"></textarea> </td>  
  69.             </tr>  
  70.               
  71.     <tr>  
  72.     <td colspan="2" class="inp">  
  73.         <input class="submit" type="submit" name="button" id="button" value="提交" style="color:#FFFFFF"/>  
  74.         <input class="submit" type="reset" name="button2" id="button2" value="重置"style="color:#FFFFFF" />  
  75.     </td>  
  76.     </tr>  
  77.         </table>  
  78.     </form>  
  79.     </div>  
  80.   </body>  
  81.     <script type="text/javascript">  
  82.         var editor = new wangEditor('content');  
  83.         editor.config.menus = [  
  84.                     'bold',  
  85.                     'underline',  
  86.                     'italic',  
  87.                     'strikethrough',  
  88.                     'eraser',  
  89.                     'forecolor',  
  90.                     'bgcolor',  
  91.                     '|',  
  92.                     'link',  
  93.                     'unlink',  
  94.                     'table',  
  95.                     'emotion',  
  96.                     '|',  
  97.                     'img',  
  98.                     'video',  
  99.                     'location',  
  100.                          ];  
  101.            
  102.         editor.create();  
  103.     </script>  
  104. </html>  
  好吧，由于代码段较多，这里不能一一介绍，后续直接介绍一下这个项目开发过程中的错误细节，完善之后把源码上传到资源那里，这个项目实现起来较简单，童鞋们可以根据设计要求试试身手哦！

源码地址：http://download.****.net/detail/weixin_36380516/9728880

相关推荐