[心得] 拖拉式選課
記得在很久之前,有看到拖拉式的選課,
不過也忘了介紹網址在哪,旁邊有個小框框會提醒哪邊衝堂
最近想一想也來簡易做一個好了XD
DEMO網址:http://ppt.cc/UKNw
比較喜歡這種直覺式的,想要什麼課程,
就像購物車一樣,丟進去,不喜歡再拉回來,
JS主要有三個物件
課程表、課程、課程購物車
(還是搞不太懂JS的物件怎寫XDDDDD,雖然有寫出來)
宣告則要:
var c = new Cart( 購物車的ID, 課程區塊的Class);
var t = new Table( 課程表的ID);
ex:
var c = new Cart("#tabs", ".elective");
var t = new table("#course_table");
c.set_table(t); //綁定課程表
資料結構如下:
<div class="area required">
<label class="course_info">
<ol>國文</ol>
<ol>陶冤明</ol>
<ol>[一]1.2.3</ol>
<input type="hidden" class="course_id" value="598"> //課程的ID
<label class="week"> //某天的上課日
<input type="hidden" class="day" value="1"> //表示星期一
<input type="hidden" class="no" value="1"> //第一堂課
<input type="hidden" class="no" value="2">
<input type="hidden" class="no" value="3">
</label>
</label>
</div>
物件方法
-購物車部份-
set_target() 設定分頁標籤名稱
set_table() 設定課程表
-課程表部份-
set_hover_in_table() 在課程表內,移到同課程的顏色變化
set_hover_in_cart() 在購物車內,移過時在課程表內的顏色變化
get_rows() 取得列數
get_cols() 取得欄數
get_data() 取得表格內的資料
remove() 移出課程
-課程部份-
get_id() 取得課程ID
get_cross() 課程是否跨天數
get_week() 取得上課日
僅是簡易版啦...
大家就多見諒XDDDDDDD
--
人 究竟是什麼時候會死?
是被槍打中的時候嗎 ...不是
得到不治之症嗎 ...也不是
那會是喝了劇毒香菇湯之後嗎 ...當然不是
而是 被世人遺忘的時候。
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 219.84.186.13
推
01/09 22:35, , 1F
01/09 22:35, 1F
→
01/11 21:54, , 2F
01/11 21:54, 2F
→
01/11 22:43, , 3F
01/11 22:43, 3F
推
01/25 23:05, , 4F
01/25 23:05, 4F