前言
第一篇 基础知识篇
第1章 HTML5开发前奏
视频讲解：21分
1.1 为什么选择HTML5语言
1.2 HTML发展历程
1.3 谁在开发HTML
1.4 HTML5的新认识
1.4.1 兼容性
1.4.2 实用性和用户优先
1.4.3 化繁为简
1.5 无插件范式
1.6 探秘——HTML5新特性
1.7 HTML的标记构成
1.7.1 HTML标记的使用技巧
1.7.2 开始标记
1.7.3 头部标记
1.7.4 标题标记
<br>1.7.5 主体标记<body><br>1.7.6 编写文件时的注意事项<br>1.8 编写第一个HTML文件<br>1.8.1 HTML文件的编写方法<br>1.8.2 手工编写页面<br>1.8.3 使用可视化软件制作页面<br>1.8.4 使用浏览器浏览HTML文件<br>1.8.5 明日图书网使用HTML开发<br>1.9 小结<br>1.10 习题<br>第2章 HTML5带来的标记变化<br>视频讲解：43分<br>2.1 重中之重——头部标记<br>2.2 名称所在——标题<title><br>2.3 隐藏很深——元信息标记<meta><br>2.3.1 页面关键字<br>2.3.2 页面描述<br>2.3.3 编辑工具<br>2.3.4 作者信息设置<br>2.3.5 限制搜索方式<br>2.3.6 网页文字及语言<br>2.3.7 定时跳转页面<br>2.3.8 有效期的设置<br>2.3.9 禁止从缓存中调用<br>2.3.10 删除过期的cookie<br>2.3.11 强制打开新窗口<br>2.3.12 网页的过渡效果设置<br>2.4 基底网址标记<base><br>2.5 容量瓶——页面的主体标记<body><br>2.5.1 彩色字体——text<br>2.5.2 背景颜色属性——bgcolor<br>2.5.3 背景图像属性——background<br>2.5.4 链接文字属性——link<br>2.5.5 边距——margin<br>2.6 程序员的备忘录——注释<！—— ——><br>2.7 上机实践<br>2.7.1 创建基本的HTML网页<br>2.7.2 设定自动刷新<br>2.8 小结<br>2.9 习题<br>第3章 HTML5网页的基本要素<br>视频讲解：28分<br>3.1 从小到大——标题文字<br>3.1.1 标题字标记<H><br>3.1.2 标题文字的对齐方式——align<br>3.2 变化万千——文字格式<br>3.2.1 文字字体——face<br>3.2.2 字号——size<br>3.2.3 文字颜色——color<br>3.2.4 粗体、斜体、下划线——strong、em、u<br>3.2.5 上标与下标——sup、sub<br>3.2.6 删除线——strike<br>3.2.7 等宽文字标记——code<br>3.2.8 空格—— ；<br>3.2.9 其他特殊符号<br>3.3 享有独立——段落格式<br>3.3.1 实现段落——p<br>3.3.2 取消文字换行标记——nobr<br>3.3.3 换行标记——br<br>3.3.4 保留原始排版方式标记——pre<br>3.3.5 使文字水平居中——center<br>3.3.6 文字段落的缩进——blockquote<br>3.4 从头到尾——水平线标记<br>3.4.1 添加水平线——hr<br>3.4.2 水平线宽度与高度属性——width、height<br>3.4.3 水平线的颜色——color<br>3.4.4 水平线的对齐方式——align<br>3.4.5 去掉水平线阴影——noshade<br>3.5 其他文字标记<br>3.5.1 文字标注标记——ruby<br>3.5.2 声明变量标记——var<br>3.5.3 忽视HTML标签标记——plaintext、xmp<br>3.6 上机实践<br>3.6.1 设置地址文字标记<address><br>3.6.2 基字标记<basefont><br>3.6.3 在文字上方标注说明标记<rt><br>3.7 小结<br>3.8 习题<br>第4章 让珍珠串起来——列表<br>视频讲解：33分<br>4.1 有条不紊——列表标记<br>4.2 欠缺规范——无序列表<br>4.2.1 无序列表标记——ul<br>4.2.2 无序列表的类型——type<br>4.3 井井有条——有序列表<br>4.3.1 有序列表标记——ol<br>4.3.2 有序列表的类型——type<br>4.3.3 有序列表的起始数值——start<br>4.4 定义列表标记——dl<br>4.5 菜单列表标记——menu<br>4.6 目录列表——dir<br>4.7 一层又一层——嵌套列表<br>4.7.1 定义列表的嵌套<br>4.7.2 无序列表和有序列表的嵌套<br>4.8 上机实践<br>4.8.1 列表之间的嵌套<br>4.8.2 定义列表的使用<br>4.8.3 ol列表的使用<br>4.9 小结<br>4.10 习题<br>第5章 在迷宫中寻找出口——超链接<br>视频讲解：21分<br>5.1 超链接<br>5.2 关于路径<br>5.2.1 绝对路径<br>5.2.2 相对路径<br>5.2.3 根路径<br>5.3 从哪里开始，到哪里结束——超链接<br>5.3.1 如何使用超链接标记<br>5.3.2 链接到另一个网页<br>5.3.3 超链接的目标窗口<br>5.4 深层挖掘——内部链接<br>5.5 查找方便——书签链接<br>5.5.1 建立书签<br>5.5.2 链接到同一页面的书签<br>5.5.3 链接到不同页面的书签<br>5.6 范围广泛——外部链接<br>5.6.1 通过HTTP<br>5.6.2 通过FTP<br>5.6.3 发送Email<br>5.6.4 下载文件<br>5.7 其他链接<br>5.7.1 脚本链接<br>5.7.2 空链接<br>5.8 上机实践<br>5.8.1 显示超链接的提示信息<br>5.8.2 设置图片的超链接<br>5.9 小结<br>5.10 习题<br>第6章 如何显示图像<br>视频讲解：33分<br>6.1 必须知道的图像格式<br>6.2 美丽图像-img<br>6.3 了解内在——图像属性<br>6.3.1 图像高度——height<br>6.3.2 图像宽度——width<br>6.3.3 图像边框——border<br>6.3.4 图像水平间距——hspace<br>6.3.5 图像垂直间距——vspace<br>6.3.6 图像相对于文字基准线的对齐方式——align<br>6.3.7 图像的提示文字——alt<br>6.4 跳转——图像的超链接<br>6.4.1 图像的超链接<br>6.4.2 图像热区链接<br>6.5 上机实践<br>6.5.1 图像中的提示文字属性<br>6.5.2 水平对齐、垂直对齐和文本围绕<br>6.6 小结<br>6.7 习题<br>第7章 让程序听话——表格的应用<br>视频讲解：47分<br>7.1 有序显示数据的基础——表格<br>7.1.1 表格的基本构成——table、tr、td<br>7.1.2 表格的标题——caption<br>7.1.3 表格的表头——th<br>7.2 里面的珍品——表格属性<br>7.2.1 表格宽度——width<br>7.2.2 表格高度——height<br>7.2.3 表格对齐方式——align<br>7.3 围绕一圈——表格边框<br>7.3.1 表格边框宽度——border<br>7.3.2 表格边框颜色——bordercolor<br>7.3.3 内框宽度——cellspacing<br>7.3.4 表格内文字与边框间距——cellpadding<br>7.4 五彩世界——表格背景<br>7.4.1 表格背景颜色——bgcolor<br>7.4.2 表格的背景图像——background<br>7.5 有效位置——表格行属性<br>7.5.1 行高度的设置——height<br>7.5.2 行的边框颜色——bordercolor<br>7.5.3 行的背景颜色——bgcolor<br>7.5.4 行文字的水平对齐方式——align<br>7.5.5 行文字的垂直对齐方式——valign<br>7.5.6 表格标题的垂直对齐方式——align<br>7.6 深入了解——单元格属性<br>7.6.1 单元格大小——width、height<br>7.6.2 水平跨度——colspan<br>7.6.3 垂直跨度——rowspan<br>7.6.4 对齐方式——align、valign<br>7.6.5 单元格的背景色——bgcolor<br>7.6.6 单元格的边框颜色——bordercolor<br>7.6.7 单元格的亮边框——bordercolorlight<br>7.6.8 单元格的暗边框——bordercolordark<br>7.6.9 单元格的背景图像——background<br>7.7 完整的表格结构<br>7.7.1 表格的表首标记——thead<br>7.7.2 表格的表主体标记——tbody<br>7.7.3 表格的表尾标记——tfoot<br>7.8 一层又一层——表格嵌套<br>7.9 上机实践<br>7.9.1 表格的内部边框样式属性rules<br>7.9.2 表格的边框样式属性frame<br>7.10 小结<br>7.11 习题<br><br>第二篇 核心技术篇<br>第8章 更上一层楼——div标记<br>视频讲解：32分<br>8.1 折叠在一起——层<br>8.1.1 层的分类<br>8.1.2 定义数据块<br>8.2 独占一行——<div>标记<br>8.2.1 <div>标记<br>8.2.2 <div>标记的属性<br>8.2.3 <span>标记与<div>标记<br>8.3 <iframe>标记<br>8.3.1 <iframe>标记<br>8.3.2 <iframe>标记的属性<br>8.4 <layer>标记和<ilayer>标记<br>8.4.1 层标记的使用<br>8.4.2 <layer>标记和<ilayer>标记的区别<br>8.5 应用<div>标记制作下拉菜单导航条<br>8.6 上机实践<br>8.7 小结<br>8.8 习题<br>第9章 获取数据——表单页面<br>视频讲解：25分<br>9.1 什么是表单<br>9.2 处理页面——表单标记<br>9.2.1 处理程序——action<br>9.2.2 表单名称——name<br>9.2.3 传送方法——method<br>9.2.4 编码方式——enctype<br>9.2.5 目标显示方式——target<br>9.3 添加控件<br>9.4 特定属性——输入标记<br>9.4.1 文字字段——text<br>9.4.2 密码域——password<br>9.4.3 单选按钮——radio<br>9.4.4 复选框——checkbox<br>9.4.5 普通按钮——button<br>9.4.6 提交按钮——submit<br>9.4.7 重置按钮——reset<br>9.4.8 图像域——image<br>9.4.9 隐藏域——hidden<br>9.4.10 文件域——file<br>9.5 菜单列表类标记<br>9.6 文本域标记<textarea><br>9.7 <id>标记<br>9.8 上机实践<br>9.8.1 使用enctype属性设置文件上传<br>9.8.2 使用特定属性来提交表单<br>9.9 小结<br>9.10 习题<br>第10章 新颖奇特——多媒体页面<br>视频讲解：18分<br>10.1 走来走去——文字的滚动<br>10.1.1 文字滚动——marquee<br>10.1.2 方向滚动——direction<br>10.1.3 方式滚动——behavior<br>10.1.4 速度滚动——scrollamount<br>10.1.5 延迟滚动——scrolldelay<br>10.1.6 循环滚动——loop<br>10.1.7 范围滚动——width、height<br>10.1.8 背景颜色滚动——bgcolor<br>10.1.9 空间滚动——hspace、vspace<br>10.2 有声有色——背景音乐<br>10.2.1 背景音乐——bgsound<br>10.2.2 循环播放次数——loop<br>10.3 影像观看——多媒体文件<br>10.3.1 多媒体文件标记——embed<br>10.3.2 自动运行——autostart<br>10.3.3 媒体文件的循环播放——loop<br>10.3.4 隐藏面板——hidden<br>10.4 上机实践<br>10.4.1 嵌入flash动画<br>10.4.2 嵌入Mp3音乐<br>10.5 小结<br>10.6 习题<br>第11章 多姿多彩——绘制图形<br>视频讲解：84分<br>11.1 canvas的基础知识<br>11.1.1 canvas是什么<br>11.1.2 在页面中放置canvas元素<br>11.1.3 绘制带边框矩形<br>11.2 在画布中使用路径<br>11.2.1 使用arc方法绘制圆形<br>11.2.2 使用moveTo与lineTo路径绘制火柴人<br>11.2.3 绘制贝济埃曲线<br>11.3 运用样式与颜色<br>11.3.1 fillStyle 和 strokeStyle属性<br>11.3.2 透明度 globalAlpha<br>11.3.3 线型的属性<br>11.4 绘制渐变图形<br>11.4.1 绘制线性渐变<br>11.4.2 绘制径向渐变<br>11.5 绘制变形图形<br>11.5.1 坐标的变换<br>11.5.2 矩阵变换<br>11.6 组合多个图形<br>11.7 给图形绘制阴影<br>11.8 应用图像<br>11.8.1 绘制图像<br>11.8.2 图像的局部放大<br>11.8.3 图像平铺<br>11.8.4 图像裁剪<br>11.8.5 像素的处理<br>11.9 绘制文字<br>11.10 保存与恢复状态<br>11.11 文件的保存<br>11.12 对画布绘制实现动画<br>11.13 上机实践<br>11.13.1 桌面时钟<br>11.13.2 移动、缩放、旋转绘制的图形<br>11.13.3 使用drawImage方法在画布中绘制图像<br>11.14 小结<br>11.15 习题<br>第12章 与众不同——HTML5与HTML<br>视频讲解：50分<br>12.1 语法的改变<br>12.1.1 HTML5的语法变化<br>12.1.2 HTML5中的标记方法<br>12.1.3 HTML5与之前HTML版本的不一致性<br>12.1.4 标记示例<br>12.2 新增的元素和废除的元素<br>12.2.1 新增的结构元素<br>12.2.2 新增的块级（block）的语义元素<br>12.2.3 新增的行内（inline）的语义元素<br>12.2.4 新增的嵌入多媒体元素与交互性元素<br>12.2.5 新增的input元素的类型<br>12.2.6 废除的元素<br>12.3 新增的属性和废除的属性<br>12.3.1 新增的属性<br>12.3.2 废除的属性<br>12.4 全局属性<br>12.4.1 contentEditable属性<br>12.4.2 designMode属性<br>12.4.3 hidden属性<br>12.4.4 spellcheck属性<br>12.4.5 tabindex属性<br>12.5 上机实践<br>12.5.1 article元素嵌套<br>12.5.2 section元素<br>12.5.3 spellcheck属性的使用<br>12.6 小结<br>12.7 习题<br>第13章 一剑封喉的武器——文件与拖放<br>视频讲解：40分<br>13.1 选择文件<br>13.1.1 通过file对象选择文件<br>13.1.2 使用Blob接口获取文件的类型与大小<br>13.1.3 通过类型过滤选择的文件<br>13.2 使用FileReader接口读取文件<br>13.2.1 检测浏览器对FileReader接口<br>13.2.2 FileReader接口的方法<br>13.2.3 使用 readAsDataURL方法预览图片<br>13.2.4 使用 readAsText方法读取文本文件<br>13.2.5 FileReader接口中的事件<br>13.3 拖放API<br>13.3.1 实现拖放的步骤<br>13.3.2 通过拖放显示欢迎信息<br>13.4 dataTransfer对象应用详解<br>13.4.1 使用effectAllowed和dropEffect属性设置拖放效果<br>13.4.2 使用setDragImage方法设置拖放图标<br>13.5 上机实践<br>13.5.1 使用JavaScript实现元素拖放<br>13.5.2 使用拖放API将商品拖入购物车<br>13.5.3 元素在拖放过程中触发的事件<br>13.6 小结<br>13.7 习题<br>第14章 另一个世界——多媒体播放<br>视频讲解：36分<br>14.1 HTML5多媒体的简述<br>14.1.1 HTML4中多媒体的应用<br>14.1.2 HTML5页面中的多媒体<br>14.2 多媒体元素基本属性<br>14.3 多媒体元素常用方法<br>14.3.1 媒体播放时的方法<br>14.3.2 canPlayType方法<br>14.4 多媒体元素重要事件<br>14.4.1 事件处理方式<br>14.4.2 事件介绍<br>14.4.3 事件示例<br>14.5 上机实践<br>14.5.1 自定义video元素控制条工具栏<br>14.5.2 video元素的error属性的返回值<br>14.5.3 通过timeupdate事件显示媒体文件播放时间<br>14.6 小结<br>14.7 习题<br><br>第三篇 高级应用篇<br>第15章 疯狂HTML5——表单<br>视频讲解：48分<br>15.1 新增元素与属性<br>15.1.1 新增的属性<br>15.1.2 增加与改良的input元素的种类<br>15.1.3 output元素的添加<br>15.1.4 应用新增元素制作注册表单<br>15.2 对表单的验证<br>15.2.1 自动验证<br>15.2.2 checkValidity显式验证法<br>15.2.3 避免验证<br>15.2.4 使用setCustomValidity方法自定义错误信息<br>15.3 增加的页面元素<br>15.3.1 新增的figure元素与figcaption元素<br>15.3.2 新增的details元素<br>15.3.3 新增的mark元素<br>15.3.4 新增的progress元素<br>15.3.5 新增的meter元素<br>15.3.6 改良的ol列表<br>15.3.7 改良的dl列表<br>15.3.8 加以严格限制的cite元素<br>15.3.9 重新定义的small元素<br>15.4 上机实践<br>15.4.1 search搜索类型的input元素<br>15.4.2 range类型的input元素<br>15.5 小结<br>15.6 习题<br>第16章 划时代的Web API<br>视频讲解：49分<br>16.1 初识Web Storage<br>16.1.1 Web Storage是什么<br>16.1.2 使用Web Storage中的API<br>16.1.3 sessionStorage和localStorage的实例——计数器<br>16.1.4 Web Storage综合实例——留言本<br>16.1.5 JSON对象的存数实例——用户信息卡<br>16.2 本地数据库<br>16.2.1 Web SQL数据库简介<br>16.2.2 使用Web SQL Database API<br>16.3 跨文档消息通信<br>16.3.1 使用postMessage API<br>16.3.2 跨域通信<br>16.4 上机实践<br>16.5 小结<br>16.6 习题<br>第17章 齐头并进——Web Worker处理线程<br>视频讲解：21分<br>17.1 Web Worker概貌<br>17.1.1 创建和使用Worker<br>17.1.2 Web Worker应用实例——求和运算<br>17.2 在Worker内部能做什么<br>17.3 多个JavaScript文件的加载与执行<br>17.4 线程嵌套<br>17.4.1 单层嵌套<br>17.4.2 在多个子线程之间进行数据的交互<br>17.5 上机实践<br>17.5.1 使用线程传递JSON对象<br>17.5.2 使用线程嵌套交互数据<br>17.6 小结<br>17.7 习题<br>第18章 不劳而获——离线应用程序<br>视频讲解：13分<br>18.1 HTML5离线Web应用概述<br>18.1.1 离线Web应用概述<br>18.1.2 本地缓存与浏览器网页缓存的区别<br>18.2 创建HTML5离线应用<br>18.2.1 缓存清单（manifest）<br>18.2.2 配置IIS服务器<br>18.2.3 浏览manifest清单<br>18.3 浏览器与服务器的交互过程<br>18.4？applicationCache对象<br>18.4.1 swapCache方法<br>18.4.2 applicationCache对象的事件<br>18.5 上机实践<br>18.5.1 简单离线应用<br>18.5.2 离线留言数据交互<br>18.6 小结<br>18.7 习题<br>第19章 获取地理位置信息<br>视频讲解：12分<br>19.1 Geolocation API的概述<br>19.1.1 使用getCurrentPosition获取当前地理位置<br>19.1.2 持续监视当前地理位置的信息<br>19.1.3 停止获取当前用户的地理位置信息<br>19.2 position对象<br>19.3 在页面上使用Google地图<br>19.4 上机实践<br>19.4.1 获取地理位置定位<br>19.4.2 用HTML5开发地理位置定位地图<br>19.5 小结<br>19.6 习题<br><br>第四篇 项目实战篇<br>第20章 旅游信息网前台页<br>视频讲解：23分<br>20.1 需求分析<br>20.2 系统设计<br>20.2.1 系统目标<br>20.2.2 网站预览<br>20.3 系统开发及运行环境<br>20.4 关键技术<br>20.4.1 网站主体结构设计<br>20.4.2 HTML5结构元素的使用<br>20.5 网站公共部分设计<br>20.5.1 设计网站公共header<br>20.5.2 设计网站公共footer<br>20.6 网站主页设计<br>20.6.1 显示网站介绍及相关图片<br>20.6.2 主页左侧导航的实现<br>20.7 “留下足迹”页设计<br>20.7.1 播放音乐<br>20.7.2 添加留言功能的实现<br>20.8 小结</div>
<div class="showMore"><i class="bShowIcon"></i><span class="showText">展开</span></div>
</div>
</div>
</div>
</div>
</div>
<!--加入我的书架成功弹框-->
<div class="joinArea">
<div class="cgPopupMask"></div>
<div class="joinCon">
<img src="/tcshop/resource/front-resource/images/info07.png" alt="" />
<div class="joinText">
加入书架成功！
</div>
<div class="fn-clear">
<a class="goOnBuy fn-left" href="javascript:;" onclick="continueSee()">继续借书</a>
<a class="goAccount fn-left" href="/tcshop/1111/cart/cart.html">去结算</a>
</div>
</div>
</div>
<!--收藏图书弹框-->
<div class="delColArea">
<div class="cgPopupMask"></div>
<div class="colCon">
<div class="cgPopupConTop">
<div class="hisPopTit">
收藏图书成功！
</div>
<div class="iKnow">
我知道了(<span class="iKnowTime">3</span>)
</div>
</div>
</div>
</div>
<!-- 评论弹窗 -->
<div class="delColArea" id="comment_view">
<div class="cgPopupMask"></div>
<div class="commont_div">
<div style="margin-top:10px;margin-bottom:10px;margin-left:-10px;">
发表书评
</div>
<div style="border:2px solid #DDD; padding: 5px;" >
<textarea style="width:100%;height:150px;resize:none;" id="comment">
</textarea>
</div>
<div style="text-align:right;margin-top:5px;">
<button onclick="hideComment()" style="padding:4px;background:#888888;color:#FFFFFF;margin-right:10px;border-radius:2px;cursor:pointer">
取消
</button>
<button onclick="sendComment()" style="padding:4px;background:#dc281c;color:#FFFFFF;border-radius:2px;cursor:pointer">
发表
</button>
</div>
</div>
</div>
<!--登录弹框-->
<div class="cgPopupArea" id="loginArea">
<div class="cgPopupMask"></div>
<div class="cgPopupCon">
<div class="cgPopupConTop">
<i class="cloLogin cloPop"></i>
<div class="readLogin">读者登录</div>
<!--手机注册的图书馆code字符串 例如：1039,1096-->
<p class="warmPrompt">
请选择您读者所在的图书馆
</p>
<div class="loginWrap">
<div class="loginRoom loginSel fn-clear">
<div class="loginIcon loginRoomIcon fn-left">
</div>
<font class="roomName fn-left" id="pLib">选择图书馆</font>
<select id="unitLibCode" class="selDown " onChange="changeLib(this)">
<option selected="selected" value="lib_zjlib">省本级</option>
<option value="lib_330400000">嘉兴市</option>
<option value="lib_330500000">湖州市</option>
<option value="lib_330700000">金华市</option>
<option value="lib_331100000">丽水市</option>
<option value="lib_331000000">台州市</option>
<option value="lib_zslib">舟山市</option>
<option value="lib_qzlib">衢州市</option>
<option value="lib_wzlib">温州市</option>
<option value="lib_hzlib">杭州市</option>
<option value="lib_nblib">宁波市</option>
<option value="lib_sxlib">绍兴市</option>
</select>
<div class="flag03">
</div>
</div>
<div class="loginError">
</div>
</div>
<div class="loginWrap" id="cUnionWrap" >
<div class="loginRoom loginSel fn-clear">
<div class="loginIcon loginRoomIcon fn-left">
</div>
<font class="roomName fn-left" id="cLib">浙江图书馆</font>
<select id="cLibSelect" class="selDown" onChange="changeCLib()">
<option value="330000000,zjlib">浙江图书馆</option>
</select>
<div class="flag03">
</div>
</div>
<div class="loginError">
</div>
</div>
<div class="loginWrap">
<div class="loginSel fn-clear">
<div class="loginIcon loginHead fn-left">
</div>
<input class="userID fn-left" type="text" name="username"
id="username" value="" placeholder="请输入身份证号" onblur="accCheck('acc')"/>
</div>
<div class="loginError" id="accMsg">
</div>
</div>
<div class="loginWrap">
<div class="loginSel fn-clear">
<div class="loginIcon loginPass fn-left ">
</div>
<input class="userPass fn-left " type="password" name="password"
id="password" value="" placeholder="请输入读者密码" onblur="accCheck('pwd')"/>
</div>
<div class="loginError" id="pwdMsg">
</div>
</div>
<div class="loginWrap">
<div class="fn-clear">
<div class="loginSel loginCode fn-left codeWrap">
<div class="loginIcon loginCode fn-left ">
</div>
<input class="codeInput fn-left" type="text" name="vcode" id="vcode" value="" placeholder="验证码" />
</div>
<div class="codeImg fn-left">
<img src="/tcshop/ValidateImage.do"
id="codeImg"
alt="点击获取验证码"
title="点击获取验证码"
onclick="this.src='/tcshop/ValidateImage.do?t='+new Date().getTime();"/>
</div>
</div>
</div>
<div class="clickLogin" id='readerLogin'>
登录
</div>
<div style="float:right">
没有读者证？<a href="/tcshop/1111/help/168.html" style="color: #175199;">在线办证</a>
</div>
</div>
</div>
</div>
<style>
.commont_div {
width: 350px;
height: 250px;
margin-left: -185px;
padding: 0 30px;
background: #fff;
position: fixed;
left: 50%;
top: 35%;
z-index: 3;
border-radius: 5px;
font-size: 16px;
}
</style>
<script type="text/javascript">
$(function(){
loadBookcovers();
loadBookInfo("TC_TEST_OPCS",'9787111420248','1111');
})
//init the value
var seller="ZJWJSK";
var isbn="9787111420248";
var isOverHoldingCount="";
var isNotUnitCatalog="";
var status="2";
var productId="7689461";
var incart="";
var opacUrl="";
var orglib="330000000";
var jdcatalog2="3287";
var jdcatalog3="3797";
var seller="ZJWJSK";
var jdSkuId="2417076";
var stock = "1";
var pUnit = "";
var packnum = "0";
var libsellerTag="false";
var bookloginType="0";
var libunion="1";
var unitcode = "1111";
$(function(){
console.log(unitcode);
if(unitcode == "1212" || unitcode == "1039"){
$("#comment").val("");
loadComment();
}
});
// 加载 用户评论
function loadComment(){
$.ajax({
url: "/tcshop/1111/comment/findBookComment?productID="+productId,
data: {offset: 0, pageSize: 10},
success: function(res){
console.log(">>>>>>>获取的评论res");
console.log(res);
// 是否获取成功
if(res.result == "false"){
$("#comment_content").append("<div style='text-align:center;'>暂时没有评论哦~！</div>");
return ;
}
// 评论内容 list
var commentList = res.data.list;
if(commentList.length == 0){
$("#comment_content").append("<div style='text-align:center;'>暂时没有评论哦！</div>");
return ;
}
// 遍历
var c_div = "";
var nickname = ""; // 昵称
var date = ""; // 日期
for(var i = 0 ; i < commentList.length ; i++){
// 昵称 部分隐藏
nickname = commentList[i].nickname;
if(nickname == null || nickname == ""){
nickname = "默**";
}else{
nickname = nickname.substr(0,1)+"**";
}
date = commentList[i].createdate.split(" ")[0];
c_div = '<div style="margin-bottom:8px;"><div style="color: #AAA;">';
c_div += '<span style="margin-right:2px;">'+nickname+'</span>';
c_div += '<span style="font-size: 12px;">'+date+'</span></div>';
c_div += '<div style="padding-left:15px;">'+commentList[i].content+'</div></div>';
$("#comment_content").append(c_div);
}
},
error: function(err){
console.error(err);
$("#comment_content").append("<div style='text-align:center;'>暂时没有评论哦!!!</div>");
return ;
}
});
}
// 显示发表书评
function showComment(){
// 未登录，显示 登录框
dialogMsg("请您先登录！")
showLoginView();
}
// 隐藏发表书评
function hideComment(){
$("#comment_view").hide(500);
}
// 发表书评
function sendComment(){
var content = $("#comment").val()+"";
content = content.replace(/(^\s*)|(\s*$)/g, "");
if(content == ""){
dialogMsg("内容不能为空哦 ！");
return;
}
loading("提交中...")
$.ajax({
url: "/tcshop/1111/comment/releaseComment",
data: {productID: productId, content: content, status: 'n'},
success: function(res){
console.log(">>>>>>>发表的评论结果res");
console.log(res);
closeLoading();
// 显示消息
dialogMsg(res.msg);
// 是否获取成功
if(res.result == "false"){
if(res.msg.indexOf("请先登录") != -1){
showLoginView();
hideComment();
}
return ;
}
dialogMsg("提交成功！");
$("#comment").val("");
hideComment();
},
error: function(err){
closeLoading();
console.error(err);
dialogMsg("评论失败哦！！！");
return ;
}
});
}
</script>
<!--放大镜-->
<script src="/tcshop/resource/front-resource/js/jquery.jqzoom.js"></script>
<script src="/tcshop/resource/front-resource/js/jquery-labelauty.js"></script>
<script src="/tcshop/resource/front-resource/js/lanrenzhijia.js"></script>
<script type="text/javascript" src="/tcshop/resource/js/UnionLib.js?version=20220601"></script>
<script src="/tcshop/resource/front-resource/js/acc.js?version=20220601"></script>
<script src="/tcshop/resource/front-resource/js/product.js?version=20220601"></script>
<div class="footWrap">
<div class="linkWrap">
<div class="linkContent">
<!--修改start-->
<div class="fn-clear">
<ul class="linkList fn-left">
<li class="linkTit">新手上路</li>
<li>
<a href="/tcshop/1111/help/54.html" target="_blank">
快速入门
</a>
</li>
</ul>
<ul class="linkList fn-left">
<li class="linkTit">购物指南</li>
<li>
<a href="/tcshop/1111/help/72.html" target="_blank">
常见问题
</a>
</li>
</ul>
<ul class="linkList fn-left">
<li class="linkTit">支付方式</li>
<li>
<a href="/tcshop/1111/help/56.html" target="_blank">
支付方式
</a>
</li>
</ul>
<ul class="linkList fn-left">
<li class="linkTit">配送方式</li>
<li>
<a href="/tcshop/1111/help/73.html" target="_blank">
快递送货
</a>
</li>
</ul>
<ul class="linkList fn-left">
<li class="linkTit">关于我们</li>
<li>
<a href="/tcshop/1111/help/58.html" target="_blank">
关于我们
</a>
</li>
</ul>
<ul class="linkList fn-left">
<li class="linkTit">特色服务</li>
<li>
<a href="/tcshop/1111/help/81.html" target="_blank">
在线办证
</a>
</li>
</ul>
</div>
<!--修改end-->
</div>
</div>
<!--页尾-->
<div class="footer">
©广州图创计算机软件开发有限公司
</div>
</div>
</body>
</html>
