第1章 引言
1.1 重新思考Web设计
1.2 包容性设计
1.3 包容性的按钮
第2章 文档
2.1 文档类型(Doctype)
2.2 语言属性(lang)
2.3 响应式设计
2.4 字体大小(font size)
2.5 渐进增强
2.6 管理资源
2.7 字体子集
2.8
元素<br/> 2.9 <main>元素<br/> 2.10 把页面组合到一起<br/> 2.11 有关框架、预处理器和任务处理器<br/>第3章 段落<br/> 3.1 字体<br/> 3.2 排版<br/> 3.3 行距（行高）<br/> 3.4 行内链接<br/> 3.5 自动加图标<br/> 3.6 写段落<br/> 3.7 总结<br/>第4章 博客文章<br/> 4.1 <main>元素<br/> 4.2 标题结构<br/> 4.3 <article>元素<br/> 4.4 渐进增强与互用性<br/> 4.5 标题和链接文本<br/> 4.6 视频<br/> 4.7 使用流式布局<br/> 4.8 总结<br/>第5章 按模式评估<br/> 5.1 按规则评估的问题<br/> 5.2 自定义元素和Shadow DOM5<br/>第6章 导航区域<br/> 6.1 导航地标(navigationlandmark)<br/> 6.2 站点范围导航<br/> 6.3 目录<br/> 6.4 总结<br/>第7章 菜单按钮<br/> 7.1 外观<br/> 7.2 渲染图标<br/> 7.3 文本标签<br/> 7.4 旧版浏览器<br/> 7.5 操作<br/> 7.6 触摸目标<br/> 7.7 总结<br/>第8章 包容性的原型<br/> 8.1 纸质原型<br/> 8.2 从纸到代码<br/>第9章 产品列表<br/> 9.1 列表的优点<br/> 9.2 关键信息<br/> 9.3 产品缩略图<br/> 9.4 “立即购买”操作<br/> 9.5 总结<br/>第10章 筛选部件<br/> 10.1 标签结构<br/> 10.2 CSS增强<br/> 10.3 增强<br/> 10.4 加载更多结果<br/> 10.5 显示选项<br/> 10.6 允许动态内容<br/> 10.7 总结<br/>第11章 注册表单<br/> 11.1 表单的上下文<br/> 11.2 基本表单<br/> 11.3 必填字段<br/> 11.4 显示密码<br/> 11.5 表单验证<br/> 11.6 微文案<br/> 11.7 总结<br/>第12章 测试驱动的HTML标签<br/> 12.1 选择器逻辑<br/> 12.2 测试驱动器的选项卡界面<br/> 12.3 并非放之四海而皆准</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="/sscr/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="/sscr/1011/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">
<!--缓存Map手机注册的图书馆是否包含当前图书馆的code-->
温馨提示：请使用浙江工贸职业技术学院的读者帐号和密码进行登录
</p>
<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="/sscr/ValidateImage.do"
id="codeImg"
alt="点击获取验证码"
title="点击获取验证码"
onclick="this.src='/sscr/ValidateImage.do?t='+new Date().getTime();"/>
</div>
</div>
</div>
<div class="clickLogin" id='readerLogin'>
登录
</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",'9787115458186','1011');
})
//init the value
var seller="XHSD";
var isbn="9787115458186";
var isOverHoldingCount="1";
var isNotUnitCatalog="0";
var status="2";
var productId="1629112";
var incart="";
var opacUrl="";
var orglib="zjitclib";
var jdcatalog2="";
var jdcatalog3="";
var seller="XHSD";
var jdSkuId="5MMzgTkwMw==";
var stock = "-1";
var pUnit = "";
var packnum = "0";
var libsellerTag="false";
var bookloginType="0";
var libunion="0";
var unitcode = "1011";
$(function(){
console.log(unitcode);
if(unitcode == "1212" || unitcode == "1039"){
$("#comment").val("");
loadComment();
}
});
// 加载 用户评论
function loadComment(){
$.ajax({
url: "/sscr/1011/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: "/sscr/1011/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="/sscr/resource/front-resource/js/jquery.jqzoom.js"></script>
<script src="/sscr/resource/front-resource/js/jquery-labelauty.js"></script>
<script src="/sscr/resource/front-resource/js/lanrenzhijia.js"></script>
<script type="text/javascript" src="/sscr/resource/js/UnionLib.js?version=20220601"></script>
<script src="/sscr/resource/front-resource/js/acc.js?version=20220601"></script>
<script src="/sscr/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="/sscr/1011/help/54.html" target="_blank">
快速入门
</a>
</li>
</ul>
<ul class="linkList fn-left">
<li class="linkTit">购物指南</li>
<li>
<a href="/sscr/1011/help/72.html" target="_blank">
常见问题
</a>
</li>
</ul>
<ul class="linkList fn-left">
<li class="linkTit">支付方式</li>
<li>
<a href="/sscr/1011/help/56.html" target="_blank">
支付方式
</a>
</li>
</ul>
<ul class="linkList fn-left">
<li class="linkTit">配送方式</li>
<li>
<a href="/sscr/1011/help/73.html" target="_blank">
快递送货
</a>
</li>
</ul>
<ul class="linkList fn-left">
<li class="linkTit">关于我们</li>
<li>
<a href="/sscr/1011/help/58.html" target="_blank">
关于我们
</a>
</li>
</ul>
<ul class="linkList fn-left">
<li class="linkTit">特色服务</li>
<li>
<a href="/sscr/1011/help/81.html" target="_blank">
在线办证
</a>
</li>
</ul>
</div>
<!--修改end-->
</div>
</div>
<!--页尾-->
<div class="footer">
©广州图创计算机软件开发有限公司
</div>
</div>
</body>
</html>
