点击,切换二级知识点:
1-: 可以点击 [上一节][下一节] 切换 二级知识点, 同时 右边的 目录也会相应的展开 和关闭.
2-: 也可以直接点击 右边的 目录 进行知识点的切换.
----------------------------------------------------------
1: 生成 知识点页面的函数.
1 public function listAction() 2 { 3 //知识点id: 4 $knowledgeId = $_REQUEST["knowledgeId"]; 5 6 $DetailsModel = new DetailsModel(); 7 $where["where"] = " knowledgeId = $knowledgeId order by orderBy asc , id asc "; 8 9 $data = $DetailsModel->getDataList($where); 10 11 //节奏: 12 $parameter["list"] = $data; 13 //知识点: 14 $parameter["KnowledgeModel"] = new KnowledgeModel($knowledgeId); 15 //知识点评价: 16 $HEvaluationProxyController = new HEvaluationProxyController(); 17 $parameter["evaluation"] = $HEvaluationProxyController->getEvaluationByKnowledgeIdService($knowledgeId); 18 19 20 if (isset($_SESSION["userId"])) 21 { 22 //给知识点增加一条学习记录: 23 $HCourseRecordProxyController = new HCourseKnowledgeRecordProxyController(); 24 25 $userId =$_SESSION["userId"]; 26 $KnowledgeModel = new KnowledgeModel($knowledgeId); 27 $courseId = $KnowledgeModel->courseId; 28 $HCourseRecordProxyController->insertRecordService($userId, $courseId, $knowledgeId); 29 } 30 31 32 //泥塑: 33 // if ($knowledgeId == 35) 34 // { 35 // $this->display("Home/Course/ns/ns00.php", $parameter); 36 // } 37 // elseif ($knowledgeId == 96 ) { 38 // //大足石刻: 39 // $this->display("Home/Course/dzsk/dzsk00.php", $parameter); 40 // } 41 // elseif ($knowledgeId == 156) { 42 // //皮影: 43 // $this->display("Home/Course/piying/piying00.php", $parameter); 44 // } 45 // else 46 // { 47 // $this->display("Home/detailsList.php", $parameter); 48 // } 49 // 50 51 52 //获取知识点中的 所有的 二级知识点.按照排序: 53 $KnowledgeModel = new KnowledgeModel($knowledgeId); 54 $courseId = $KnowledgeModel->courseId; 55 $where2["where"] = " courseId = $courseId order by orderBy asc , id asc "; 56 $data2 = $KnowledgeModel->getDataList($where2); 57 58 $HKnowledgeProxyController = new HKnowledgeProxyController(); 59 $list = $HKnowledgeProxyController->getTreeService($data2["rows"], 0, 0); 60 61 $listArr = array(); 62 $num = 1; 63 foreach ($list as $k => $model) 64 { 65 foreach ($model->child as $k2 => $model2) 66 { 67 $listArr[$num] = $model2->id; 68 $num++; 69 } 70 } 71 72 //当前知识点对应的key: 73 $now_key = array_search($knowledgeId, $listArr); 74 //总数: 75 $totalnum = count($listArr); 76 77 //上一个知识点id: 78 if ($now_key == 1) { 79 $beforeValue = $listArr[1]; 80 81 } else { 82 $beforeValue = $listArr[$now_key - 1]; 83 } 84 85 //下一个知识点id: 86 if ($now_key == $totalnum) { 87 $afterValue = $listArr[$totalnum]; 88 } else { 89 $afterValue = $listArr[$now_key + 1]; 90 } 91 92 93 // echo "<pre>"; 94 // var_dump($beforeValue); 95 // var_dump($afterValue); 96 // var_dump($listArr); 97 98 $parameter["beforeValue"] = $beforeValue; 99 $parameter["afterValue"] = $afterValue; 100 101 102 103 $this->display("Home/detailsList.php", $parameter); 104 105 106 107 108 109 110 111 112 113 114 //大足石刻 01 115 // $this->display("Home/Course/dzsk/dzsk00.php", $parameter); 116 // $this->display("Home/Course/dzsk/dzsk01.php", $parameter); 117 // $this->display("Home/Course/dzsk/dzsk02.php", $parameter); 118 // $this->display("Home/Course/dzsk/dzsk03.php", $parameter); 119 // $this->display("Home/Course/dzsk/dzsk04.php", $parameter); 120 121 }
载入的 detailList.php 页面:
1 <?php 2 3 //节奏: 4 $list = $parameter["list"]; 5 6 //知识点: 7 $KnowledgeModel = $parameter["KnowledgeModel"]; 8 9 //知识点评价: 10 $evaluation = $parameter["evaluation"]; 11 12 //课程: 13 $CourseModel = new CourseModel($KnowledgeModel->courseId); 14 15 //课程用户: 以user为主: 16 $UserModel = new UserModel($CourseModel->userId); 17 18 if ($UserModel->getDB) { 19 $userName = $UserModel->userName; 20 } 21 else 22 { 23 $AdminModel = new AdminModel($CourseModel->userId); 24 $userName = $AdminModel->adminName; 25 } 26 27 //上一个: 28 $beforeValue = $parameter["beforeValue"]; 29 30 //下一个: 31 $afterValue = $parameter["afterValue"]; 32 33 34 ?> 35 36 37 38 39 <!-- 评价 --> 40 <div class="evaluate" > 41 <span class="evaluateTitle" style="cursor:pointer;" onclick="shoucang(<?php echo $CourseModel->id; ?>)" >收藏 <span style="color:red;" class="glyphicon glyphicon-heart"></span></span> 42 <span class="evaluatePeople">(<?php echo $evaluation["peopleNum"]; ?>人评价)</span> 43 <span class="evaluateScore"><span><?php echo $evaluation["score"]; ?></span>.0</span> 44 <span class="evaluateStar" onclick="toEvaluation(<?php echo $KnowledgeModel->id; ?>)"> 45 46 <?php for ($i = 1; $i <= $evaluation["score"]; $i++): ?> 47 <span class="glyphicon glyphicon-star starColor"></span> 48 <?php endfor; ?> 49 50 <?php for ($i = 1; $i <= 5 - $evaluation["score"]; $i++): ?> 51 <span class="glyphicon glyphicon-star-empty"></span> 52 <?php endfor; ?> 53 </span> 54 <span class="evaluateTitle" >知识点评价</span> 55 56 <!-- 访问量: --> 57 <span class="numb">访问量: <?php echo $CourseModel->numb; ?> 人次</span> 58 </div> 59 60 61 62 63 <!-- 目录 --> 64 65 <?php if (!empty($list["rows"])): ?> 66 <div class="catalog" style="display: none;"> 67 <img src="<?php echo PROJECT . 'YYFramework/Public/images/ey/catalog.png'; ?>" > 68 69 <ul> 70 71 <?php foreach ($list["rows"] as $k => $v): ?> 72 <li><a href="#name<?php echo $v->id; ?>"><?php echo $v->title; ?></a></li> 73 <?php endforeach ?> 74 75 </ul> 76 </div> 77 78 <?php endif ?> 79 80 81 <!-- 节奏 --> 82 <div class="allDetails"> 83 84 <?php foreach ($list["rows"] as $k => $v): ?> 85 <div class="detail"> 86 <div class="detailTitle"><a id="name<?php echo $v->id; ?>"><?php echo $v->title; ?></a></div> 87 <div class="detailContent"> 88 89 90 <!-- 节奏的图文: --> 91 92 <?php 93 94 $DetailsWordsModel = new DetailsWordsModel(); 95 $where_1["where"] = " detailsId = " .$v->id. " order by orderBy asc ,id asc "; 96 $data_1 = $DetailsWordsModel->getDataList($where_1); 97 ?> 98 99 <?php foreach ($data_1["rows"] as $k1 => $v1): ?> 100 <?php echo $v1->imageText; ?> 101 <!-- <div class="defaultHr"></div> --> 102 <?php endforeach ?> 103 104 105 <!-- 节奏的 视频 --> 106 107 <?php 108 $DetailsVideosModel = new DetailsVideosModel(); 109 $where_2["where"] = " detailsId = " .$v->id. " order by orderBy asc ,id asc "; 110 $data_2 = $DetailsVideosModel->getDataList($where_2); 111 112 ?> 113 114 <?php foreach ($data_2["rows"] as $k2 => $v2): ?> 115 116 <?php if (substr($v2->video, stripos($v2->video, '.')+1) == 'swf'): ?> 117 <div class="videoDiv"> 118 <h4 style="float: left;"><?php echo $v2->title;?></h4> 119 <embed src="<?php echo UPLOAD_HTTP . $v2->video; ?>" > 120 </div> 121 <?php else: ?> 122 123 <div class="videoDiv"> 124 <h4 style="float: left;"><?php echo $v2->title;?></h4> 125 <video controls> 126 <source src="<?php echo UPLOAD_HTTP . $v2->video; ?>" type="video/mp4"> 127 </video> 128 </div> 129 130 <?php endif ?> 131 132 133 134 135 136 137 <!-- <div class="defaultHr"></div> --> 138 <?php endforeach ?> 139 140 141 <!-- 节奏的 H5 --> 142 <?php 143 $DetailsHModel = new DetailsHModel(); 144 $where_3["where"] = " detailsId = " .$v->id. " order by orderBy asc ,id asc "; 145 $data_3 = $DetailsHModel->getDataList($where_3); 146 147 ?> 148 149 <?php foreach ($data_3["rows"] as $k3 => $v3): ?> 150 151 <div class="iframeDiv"> 152 <iframe src="<?php echo $v3->url; ?>"></iframe> 153 </div> 154 155 156 <?php 157 $last = $data_3["total"] -1; 158 ?> 159 <?php if ($k3 < $last): ?> 160 <!-- <div class="defaultHr"></div> --> 161 <?php endif ?> 162 <?php endforeach ?> 163 164 165 166 </div> 167 </div> 168 <?php endforeach ?> 169 </div> 170 171 172 <div class="detailButton"> 173 <div class="detailButton_left"> 174 <div class="button2" onclick="changeChapter(<?php echo $beforeValue; ?>)">上一节</div> 175 </div> 176 <div class="detailButton_right"> 177 <div class="button2" onclick="changeChapter(<?php echo $afterValue; ?>)">下一节</div> 178 </div> 179 <div class="clearBoth"></div> 180 </div> 181 182 <div style="height:100px;"></div>
2 .点击 [上一节][下一节]触发的函数. changeChapter()
1 function changeChapter(knowledgeId) 2 { 3 4 5 //样式: 6 $("li[data-kid="+knowledgeId+"]").siblings("li[date-level='1']").addClass("hide"); 7 $("li[data-kid="+knowledgeId+"]").prevUntil("li[date-level='0']").removeClass("hide"); 8 $("li[data-kid="+knowledgeId+"]").nextUntil("li[date-level='0']").removeClass("hide"); 9 10 //触发点击事件: 11 $("li[data-kid="+knowledgeId+"]").click(); 12 }
3. 触发的 li 的点击事件. li的点击事件触发的函数.
1 function changeDetails(knowledgeId, node) 2 { 3 // console.log($(node).attr('date-level')); 4 5 //判断点击的是一级 还是二级. 6 // if ($(node).attr('date-level') == 0) { 7 // //显示当前节点 8 // if ($(node).find('.circleChose').hasClass('hide')) { 9 // $(node).find('.circleChose').removeClass('hide'); 10 // } 11 12 // //隐藏其他节点: 13 // $(node).siblings('li').each(function(index, el) { 14 // if (!$(this).find('.circleChose').hasClass('hide')) { 15 // $(this).find('.circleChose').addClass('hide'); 16 // } 17 // }); 18 // } else { 19 // //二级: 20 // $(node).prevUntil("li[date-level = 0]"); 21 // // console.log($(node).prevUntil("li[date-level = 0]")); 22 // //找到直到 data-level = 0 为止的所有选项. 23 // var tempList = $(node).prevUntil("li[date-level = 0]"); 24 25 // if (tempList.length == 0) { 26 // //当前是第一个子节点: 27 // //显示当前节点 28 // // console.log('222'); 29 // if ($(node).prev().find('.circleChose').hasClass('hide')) { 30 // $(node).prev().find('.circleChose').removeClass('hide'); 31 // } 32 33 // //隐藏其他节点: 34 // $(node).prev().siblings('li').each(function(index, el) { 35 // if (!$(this).find('.circleChose').hasClass('hide')) { 36 // $(this).find('.circleChose').addClass('hide'); 37 // } 38 // }); 39 // } else { 40 // // tempList.last().prev() 41 // //显示当前节点 42 // // console.log('333'); 43 // if (tempList.last().prev().find('.circleChose').hasClass('hide')) { 44 // tempList.last().prev().find('.circleChose').removeClass('hide'); 45 // } 46 47 // //隐藏其他节点: 48 // tempList.last().prev().siblings('li').each(function(index, el) { 49 // if (!$(this).find('.circleChose').hasClass('hide')) { 50 // $(this).find('.circleChose').addClass('hide'); 51 // } 52 // }); 53 54 // } 55 // } 56 57 // console.log('1111111111111111111111'); 58 if ($(node).attr('date-level') == 0) { 59 // console.log('22222222'); 60 $(node).siblings('li[date-level="0"]').nextUntil('li[date-level="0"]').addClass('hide'); 61 $(node).nextUntil('li[date-level="0"]').toggleClass('hide'); 62 }else{ 63 getDetails(knowledgeId); 64 } 65 66 67 68 }
点击的是 一级知识点, 不会获取知识点内容; 只有点击的是二级知识点 才会获取知识点内容.
1 function getDetails(knowledgeId) 2 { 3 $.ajax({ 4 url: 'action.php?c=HDetailsProxy&a=list', 5 type: 'POST', 6 dataType: 'html', 7 data: {'knowledgeId': knowledgeId}, 8 success: function(data){ 9 $(".leftDiv2").html(data); 10 11 12 } 13 }); 14 15 16 17 18 }
3 .右边 目录的 html结构:
图中红色部分是 一级知识点. daa-level = 0;
data-kid : 指的是 这个Knowledge的id.
