中文字幕一区二区人妻电影,亚洲av无码一区二区乱子伦as ,亚洲精品无码永久在线观看,亚洲成aⅴ人片久青草影院按摩,亚洲黑人巨大videos

上一篇：jEasyUI 創(chuàng)建拖放的購(gòu)物車 下一篇：jEasyUI 創(chuàng)建簡(jiǎn)單的菜單

jEasyUI 創(chuàng)建學(xué)校課程表

本教程將向您展示如何使用 jQuery EasyUI 創(chuàng)建一個(gè)學(xué)校課程表。 我們將創(chuàng)建兩個(gè)表格：在左側(cè)顯示學(xué)?？颇?，在右側(cè)顯示時(shí)間表。 您可以拖動(dòng)學(xué)?？颇坎⒎胖玫綍r(shí)間表單元格上。 學(xué)?？颇渴且粋€(gè) <div class="item"> 元素，時(shí)間表單元格是一個(gè) <td class="drop"> 元素。

顯示學(xué)?？颇?/h4>
????<div class="left">
????????<table>
????????????<tr>
????????????????<td><div class="item">English</div></td>
????????????</tr>
????????????<tr>
????????????????<td><div class="item">Science</div></td>
????????????</tr>
????????????<!-- other subjects -->
????????</table>
????</div>

顯示時(shí)間表

????<div class="right">
????????<table>
????????????<tr>
????????????????<td class="blank"></td>
????????????????<td class="title">Monday</td>
????????????????<td class="title">Tuesday</td>
????????????????<td class="title">Wednesday</td>
????????????????<td class="title">Thursday</td>
????????????????<td class="title">Friday</td>
????????????</tr>
????????????<tr>
????????????????<td class="time">08:00</td>
????????????????<td class="drop"></td>
????????????????<td class="drop"></td>
????????????????<td class="drop"></td>
????????????????<td class="drop"></td>
????????????????<td class="drop"></td>
????????????</tr>
????????????<!-- other cells -->
????????</table>
????</div>

拖動(dòng)在左側(cè)的學(xué)?？颇?/h4>
????$('.left .item').draggable({
????????revert:true,
????????proxy:'clone'
????});

放置學(xué)?？颇吭跁r(shí)間表單元格上

????$('.right td.drop').droppable({
????????onDragEnter:function(){
????????????$(this).addClass('over');
????????},
????????onDragLeave:function(){
????????????$(this).removeClass('over');
????????},
????????onDrop:function(e,source){
????????????$(this).removeClass('over');
????????????if ($(source).hasClass('assigned')){
????????????????$(this).append(source);
????????????} else {
????????????????var c = $(source).clone().addClass('assigned');
????????????????$(this).empty().append(c);
????????????????c.draggable({
????????????????????revert:true
????????????????});
????????????}
????????}
????});

正如您所看到的上面的代碼，當(dāng)用戶拖動(dòng)在左側(cè)的學(xué)?？颇坎⒎胖玫綍r(shí)間表單元格中時(shí)，onDrop 回調(diào)函數(shù)將被調(diào)用。我們克隆從左側(cè)拖動(dòng)的源元素并把它附加到時(shí)間表單元格上。 當(dāng)把學(xué)?？颇繌臅r(shí)間表的某個(gè)單元格拖動(dòng)到其他單元格，只需簡(jiǎn)單地移動(dòng)它即可。

上一篇：jEasyUI 創(chuàng)建拖放的購(gòu)物車 下一篇：jEasyUI 創(chuàng)建簡(jiǎn)單的菜單