※ 引述《scsnake (飄萍)》之銘言：
: 請問一下~
: 如果有一個網頁 裡面是一個表格裝著很多很多的checkbox
: 有沒有可能用javascript做出
: 滑鼠拖曳範圍內的checkbox都變成選取(本來已選取的變成未選取)
: 類似windows裡面選取檔案那樣~~
: 另外剛好看了一下版上的一些文章 多了兩個問題:
: 1.把元素都放在table來排版似乎不太推薦??那應該如何做呢?
: (不過我上面那個網頁是個座位表 用table應該還ok吧@@?)
: 2.看TonyQ大介紹jquery好像很有趣 jquery是要等js有一定程度才開始學嗎??
: --------
: 加問個問題@@
: checkbox放到表格中的話 格子最小只能縮到25px*25px 於是做出來的座位表很大
: 請問有其他替代方法嗎(就是不用checkbox 但又能選取 之後能送出選取格的資訊)
哈...= =其實有點小麻煩，不過我先試用jQuery做了模擬選取區的虛框，程式碼如下：
------------------------------------------------------------
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
/**********************************************
* 作者：liaosankai
* 日期：2008-08-12
* 網址：http://doublekai.org/blog/
* Demo：http://doublekai.org/demo/jquery/selectArea.htm
***********************************************/
$(document).ready(function(){
var startX = null;
var startY = null;
$(document).mousedown(function(e){
$("body").after("<div id='mask'></div>");
startX = e.pageX;
startY = e.pageY;
});
$(document).mouseup(function(e){
startX = null;
startY = null;
$("#mask").remove();
});
$(document).mousemove(function(e){
if(startX != null && startY != null){
$("#mask").css('position','absolute');
$("#mask").css({ border:"1px dashed #000000"});
var width = Math.abs(e.pageX - startX);
var height = Math.abs(e.pageY - startY);
$("#mask").css("height",height);
$("#mask").css("width",width);
//右下角
if(e.pageX > startX && e.pageY > startY){
$("#mask").css('left',startX);
$("#mask").css('top',startY);
//左下角
} else if(e.pageX < startX && e.pageY > startY){
$("#mask").css('left',startX - width);
$("#mask").css('top',startY);
//左上角
} else if(e.pageY < startY && e.pageX < startX){
$("#mask").css('left',e.pageX);
$("#mask").css('top',e.pageY );
//右上角
} else if(e.pageY < startY && e.pageX > startX){
$("#mask").css('left',startX);
$("#mask").css('top',startY - height);
}
}
});
});
</script>
----------------------------------------------------------------
不過話說回來= =，雖然感覺有選取區，但是實際用在文字選取的話
選到的文字一定會超過你選取區的文字
至於如何去觸發checkbox變成勾選狀態呢？= =呃...雖然有些想法，但是已經太晚了@_@
該睡了>"<，請大大自行研究jQuery再補上即可
--
我的樂多網誌http://blog.roodo.com/liaosankai
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 123.240.37.127