本次项目中的el表达式应用:
①<div class="dbsharebuttonbox"></div>百度分享CDN引用用后分享框显示的地址
<a class="bds_more" style="margin-top: 13px;" data-cmd="more"></a>
②<c:if></c:if>的应用
③没有href的标签需要的js触发事件onclick
<div class="share bdsharebuttonbox">
<c:if test="${YorNCollect == 0 || empty sessionScope.user}">
<span onclick="collectNews(1);" id="collect_1">收藏</span>
</c:if>
<c:if test="${YorNCollect == 1}">
<span onclick="collectNews(2);" id="collect_2">已收藏</span>
</c:if>
<a class="bds_more" style="margin-top: 13px;" data-cmd="more"></a>
</div>
关于el的拼接应用:阿狸/小猫/春天/,点击每个标签都有连接跳转
<div class="tag">
<c:forEach items="${laberAry}" var="data1" varStatus="status">
<span onclick="doLabelSearch('${data1}');">${data1}
<c:if test="${!status.last}">/</c:if>
</span>
</c:forEach>
</div>
关于评论分页和el拼接部署
<%@ page language="java" import="java.util.*" contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jstl/core_rt" %>
<%@ taglib prefix="str" uri="http://www.bigdata.com/jstl/string"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<c:choose>
<c:when test="${!empty page.data}">
<ul>
<c:forEach items="${page.data}" var="data">
<li>
<div class="headImg">
<img src="/images/detail.jpg" alt="">
</div>
<div class="userCont">
<div>${data.userId}</div>
<div>${data.comments }</div>
<div class="time">${str:showDate(data.addtime,'yyyy-MM-dd HH:mm')}</div>
</div>
</li>
</c:forEach>
</ul>
</c:when>
<c:otherwise>
<ul><li style="text-align: center;">暂无评论~~</li></ul>
</c:otherwise>
</c:choose>
<c:if test="${!empty page.data}">
<div id="page" class="page"
data-currentPage="${page.currentPage}"
data-totalPage="${page.totalPage}"
data-totalRow="${page.totalRow}"
>
</div>
</c:if>
<script type="text/javascript">
function pager(){
$("#page").pager({
//renderTo: null,
currentPage: $("#page").attr("data-currentPage"),
totalPage: $("#page").attr("data-totalPage"),
totalRow: $("#page").attr("data-totalRow"),
navBarStyle: '',
func: function(current){
loadCommentList(current);
}
});
}
//执行分页
pager();
</script>
关于推荐的jsp页面的拼接和推荐
<%@ page language="java" import="java.util.*" contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jstl/core_rt" %>
<%@ taglib prefix="str" uri="http://www.bigdata.com/jstl/string"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<c:choose>
<c:when test="${!empty related}">
<ul>
<c:forEach items="${related}" var="data">
<li>
<h2 style="text-align: left;"><a href="/nsinfo/detail/${data.id}" title="${str:replaceSignString(data.title,'#','#','') }">${str:replaceSignString(data.title,'#','#','')}</a></h2>
<p>
<a href="/nsinfo/detail/${data.id}" title="${data.artabstract }" >${str:subString(data.artabstract,175,'...') }</a>
</p>
<c:if test="${!empty data.pic }">
<a class="rec-img" href="/nsinfo/detail/${data.id}"><img src="${data.pic }" alt="" ></a>
</c:if>
<div class="from">
<span>来自:${data.pubsource }</span>
<span>${str:fmtLongToDate(data.createtime,'yyyy-MM-dd')}</span>
</div>
</li>
</c:forEach>
</ul>
</c:when>
<c:otherwise>
<ul><li style="padding-bottom:15px;text-align:center;">暂无推荐~~</li></ul>
</c:otherwise>
</c:choose>
js总结:
<script>
$(function(){
$(".chn-bar li").mouseenter(function () {
var $sub = $(this).children('.chn-sub');
if ($sub.length) {
$sub.fadeIn(200);
}
})
.mouseleave(function () {
var $sub = $(this).children('.chn-sub');
if ($sub.length) {
$sub.fadeOut(200);
}
});
$('.tb-search input').focus(function(){
$('.tb-confirm').show();
})
.blur(function(){
$('.tb-confirm').hide();
})
;
/* $('#collect_1').click(function () {
$(this).hide();
$('#collect_2').show();
})
$('#collect_2').click(function () {
$(this).hide();
$('#collect_1').show();
}) */
//加载评论列表和相关推荐
initList(true,true);
});
//加载顺序
function initList(Comment,Recommendation){
loadCommentList(1);
if(Recommendation){
loadRecommendationList();
}
}
//评论列表函数
function loadCommentList(currentpage){
var news_id = $("#newsid").val();
var param={
currentPage:currentpage,
newsId:news_id,
ran:Math.random()
};
$("#commentWeb").load("/nsinfo/detail/commentlist", param);
}
//加载相关推荐
function loadRecommendationList(){
var labelId=$("#labelId").val();
var lanmuid =$("#lanmuid").val();
var news_id = $("#newsid").val();
var param={
channelId:lanmuid,
label:labelId,
newsId:news_id,
ran:Math.random()
};
$("#recommendList").load("/nsinfo/detail/recommendationlist", param);
}
//添加评论
function addComment(){
if(!checkLoginInfo()){
alertMsg("请先登录。");
return false;
}
var comment = $("#comment").text().trim();
var newsid = $("#newsid").val();
if(comment==""){
alertMsg("请输入评论内容。");
$("#comment").focus();
return false;
}
$.ajax({
type:"post",
url:"/nsinfo/detail/addComment",
dataType: "text",
async:false,
data:{comments:comment,newsId:newsid},
success: function(data){
if(data==1){
alertMsg("评论成功");
$("#comment").text("");
loadCommentList(1);
} else {
alertMsg("系统出错。");
}
}
});
}
//检查登录
function checkLoginInfo(){
var result=false;
$.ajax({
type:"post",
url:"/checkLoginInfo",
dataType: "text",
async:false,
data:{},
success: function(data){
if(data==1){
result=true;
}
}
});
return result;
}
function collectNews(type){
if(!checkLoginInfo()){
alertMsg("请先登录。");
return false;
}
var news_id = $("#newsid").val();
$.ajax({
type:"post",
url:"/nsinfo/detail/checkCollect",
dataType: "json",
async:false,
data:{newsId:news_id,type:type},
success: function(data){
if(data==1){
alertMsg("收藏成功");
window.location.reload();
}else if(data==2){
alertMsg("已取消收藏");
window.location.reload();
} else {
alertMsg("系统出错。");
}
}
});
}
//标签链接搜索
function doLabelSearch(value){
var keyword = value.trim();
window.location.href = "/search?keyword="+encodeURIComponent(encodeURIComponent(keyword));
}
</script>
//百度分享插件的js
<script>
window._bd_share_config={
"common":
{"bdSnsKey":{},
"bdText": "",
"bdDesc": "",
"bdMini":"2",
"bdPic":"",
"bdStyle":"0",
"bdSize":"24"},
"share":{},
"image":
{"viewList":["qzone","tsina","tqq","renren","weixin"],
"viewText":"分享到:",
"viewSize":"16"},
"selectShare":
{"bdContainerClass":null,
"bdSelectMiniList":["qzone","tsina","tqq","renren","weixin"]}};
with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];</script>