复制代码代码如下:
<สไตล์><!--
ร่างกาย {padding-top:50px; padding-left:100px; padding-right:150px;}
.fileDiv{float:left;width:100px;height:100px;text-align:center;line-height:100px;font-size:12px;border:1px solid #cccccc;margin-right:10px;margin-bottom: 10px;}
.seled{border:1px solid #ff0000;สีพื้นหลัง:#D6DFF7;}
--></สไตล์>
<script type="text/javascript">// <![CDATA[
Array.prototype.remove = ฟังก์ชั่น ( รายการ ) {
สำหรับ( var i = 0 ; i < this.length ; i++ ){
ถ้า( รายการ == นี้[i] )
หยุดพัก;
-
ถ้า (i == this.length)
กลับ;
สำหรับ( var j = i ; j < this.length - 1 ; j++ ){
นี่[ เจ ] = นี่[ เจ + 1 ];
-
นี้.ความยาว--;
-
String.prototype.replaceAll = ฟังก์ชั่น (AFindText, ARepText){ raRegExp = RegExp ใหม่ (AFindText, "g"); ส่งคืน this.replace (raRegExp, ARepText);}
ฟังก์ชั่น getAllChildren(e) {
กลับมา e.all ? e.all : e.getElementsByTagName('*');
-
document.getElementsBySelector = ฟังก์ชั่น (ตัวเลือก) {
ถ้า (!document.getElementsByTagName) {
กลับอาร์เรย์ใหม่ ();
-
โทเค็น var = selector.split(' ');
var currentContext = อาร์เรย์ใหม่ (เอกสาร);
สำหรับ (var i = 0; i < tokens.length; i++) {
โทเค็น = โทเค็น[i].replace(/^/s+/,'').replace(//s+$/,'');;
ถ้า (token.indexOf('#') > -1) {
var bits = token.split('#');
var tagName = บิต[0];
var id = บิต [1];
องค์ประกอบ var = document.getElementById(id);
ถ้า (tagName && element.nodeName.toLowerCase() != tagName) {
กลับอาร์เรย์ใหม่ ();
-
currentContext = อาร์เรย์ใหม่ (องค์ประกอบ);
ดำเนินการต่อ;
-
ถ้า (token.indexOf('.') > -1) {
var bits = token.split('.');
var tagName = บิต[0];
var className = บิต [1];
ถ้า (!tagName) {
ชื่อแท็ก = '*';
-
พบ var = อาร์เรย์ใหม่;
var foundCount = 0;
สำหรับ (var h = 0; h < currentContext.length; h++) {
องค์ประกอบ var;
ถ้า (ชื่อแท็ก == '*') {
องค์ประกอบ = getAllChildren (currentContext [h]);
} อื่น {
องค์ประกอบ = currentContext [h] .getElementsByTagName (tagName);
-
สำหรับ (var j = 0; j < element.length; j++) {
พบ [foundCount++] = องค์ประกอบ[j];
-
-
currentContext = อาร์เรย์ใหม่;
var currentContextIndex = 0;
สำหรับ (var k = 0; k < found.length; k++) {
if (found[k].className && found[k].className.match(regExp ใหม่('//b'+className+'//b'))) {
currentContext[currentContextIndex++] = พบ[k];
-
-
ดำเนินการต่อ;
-
ถ้า (token.match(/^(/w*)/[(/w+)([=~/|/^/$/*]?)=?"?([^/]"]*)"?/ ]$/)) {
var tagName = RegExp.$1;
var attrName = RegExp.$2;
var attrOperator = RegExp.$3;
var attrValue = RegExp.$4;
ถ้า (!tagName) {
ชื่อแท็ก = '*';
-
พบ var = อาร์เรย์ใหม่;
var foundCount = 0;
สำหรับ (var h = 0; h < currentContext.length; h++) {
องค์ประกอบ var;
ถ้า (ชื่อแท็ก == '*') {
องค์ประกอบ = getAllChildren (currentContext [h]);
} อื่น {
องค์ประกอบ = currentContext [h] .getElementsByTagName (tagName);
-
สำหรับ (var j = 0; j < element.length; j++) {
พบ [foundCount++] = องค์ประกอบ[j];
-
-
currentContext = อาร์เรย์ใหม่;
var currentContextIndex = 0;
var ตรวจสอบฟังก์ชัน;
สวิตช์ (attrOperator) {
กรณี '=':
checkFunction = function(e) { return (e.getAttribute(attrName) == attrValue); -
หยุดพัก;
กรณี '~':
checkFunction = function(e) { return (e.getAttribute(attrName).match(regExp ใหม่('//b'+attrValue+'//b'))); -
หยุดพัก;
กรณี '|':
checkFunction = function(e) { return (e.getAttribute(attrName).match(new RegExp('^'+attrValue+'-?'))); -
หยุดพัก;
กรณี '^':
checkFunction = function(e) { return (e.getAttribute(attrName).indexOf(attrValue) == 0); -
หยุดพัก;
กรณี '$':
checkFunction = function(e) { return (e.getAttribute(attrName).lastIndexOf(attrValue) == e.getAttribute(attrName).length - attrValue.length); -
หยุดพัก;
กรณี '*':
checkFunction = function(e) { return (e.getAttribute(attrName).indexOf(attrValue) > -1); -
หยุดพัก;
ค่าเริ่มต้น :
checkFunction = function(e) { return e.getAttribute(attrName); -
-
currentContext = อาร์เรย์ใหม่;
var currentContextIndex = 0;
สำหรับ (var k = 0; k < found.length; k++) {
ถ้า (checkFunction (พบ [k])) {
currentContext[currentContextIndex++] = พบ[k];
-
-
ดำเนินการต่อ;
-
tagName = โทเค็น;
พบ var = อาร์เรย์ใหม่;
var foundCount = 0;
สำหรับ (var h = 0; h < currentContext.length; h++) {
องค์ประกอบ var = currentContext[h].getElementsByTagName(tagName);
สำหรับ (var j = 0; j < element.length; j++) {
พบ [foundCount++] = องค์ประกอบ[j];
-
-
currentContext = พบ;
-
กลับบริบทปัจจุบัน;
-
ฟังก์ชั่น addEvent (eventType, eventFunc, eventObj) {
eventObj = เหตุการณ์Obj || เอกสาร;
if(window.attachEvent) eventObj.attachEvent("on"+eventType,eventFunc);
ถ้า (window.addEventListener) eventObj.addEventListener (eventType,eventFunc,false);
-
ฟังก์ชั่น clearEventBubble (evt) {
evt = evt || หน้าต่าง.เหตุการณ์;
ถ้า (evt.stopPropagation) evt.stopPropagation(); อย่างอื่น evt.cancelBubble = จริง;
ถ้า (evt.preventDefault) evt.preventDefault(); อื่น evt.returnValue = false;
-
ฟังก์ชั่น posXY (เหตุการณ์) {
เหตุการณ์ = เหตุการณ์ || หน้าต่าง.เหตุการณ์;
var posX = event.pageX || (เหตุการณ์ clientX +
(document.documentElement.scrollLeft || document.body.scrollLeft));
var posY = event.pageY || (event.clientY +
(document.documentElement.scrollTop || document.body.scrollTop));
กลับ {x:posX, y:posY};
-
var _selectedRegions = [];
ฟังก์ชั่น RegionSelect (selRegionProp) {
นี้.ภูมิภาค =[];
var _regions = document.getElementsBySelector(selRegionProp["ภูมิภาค"]);
ถ้า(_regions && _regions.length > 0){
var _self = นี่;
สำหรับ(var i=0; i< _regions.length;i++){
_regions[i].onmousedown = ฟังก์ชั่น(){
var evt = window.event || ข้อโต้แย้ง[0];
ถ้า(!evt.shiftKey && !evt.ctrlKey){
// 清空所有select样式
_self.clearSelections(_ภูมิภาค);
this.className += " "+_self.selectedClass;
// 清空selected数组,并加入当前select中的元素
_เลือกภูมิภาค = [];
_selectedRegions.push(นี้);
}อื่น{
ถ้า(this.className.indexOf(_self.selectedClass) == -1){
this.className += " "+_self.selectedClass;
_selectedRegions.push(นี้);
}อื่น{
this.className = this.className.replaceAll(_self.selectedClass,"");
_selectedRegions.remove(นี้);
-
-
clearEventBubble(evt);
-
this.regions.push(_ภูมิภาค[i]);
-
-
this.selectedClass = selRegionProp ["selectedClass"];
this.selectedRegion = [];
this.selectDiv = null;
this.startX = โมฆะ;
this.startY = โมฆะ;
-
RegionSelect.prototype.select = function(){
var _self = นี่;
addEvent("เมาส์ดาวน์",ฟังก์ชัน(){
var evt = window.event || ข้อโต้แย้ง[0];
_self.onBeforeSelect(evt);
clearEventBubble(evt);
},เอกสาร);
addEvent("เมาส์มูฟ",ฟังก์ชัน(){
var evt = window.event || ข้อโต้แย้ง[0];
_self.onSelect(evt);
clearEventBubble(evt);
},เอกสาร);
addEvent("เมาส์อัพ",ฟังก์ชัน(){
_self.onEnd();
},เอกสาร);
-
RegionSelect.prototype.onBeforeSelect = ฟังก์ชั่น (evt) {
if(!document.getElementById("selContainer")){
this.selectDiv = document.createElement("div");
this.selectDiv.style.cssText = "position:absolute;width:0px;height:0px;font-size:0px;margin:0px;padding:0px;border:1px ประ #0099FF;สีพื้นหลัง:#C3D5ED;z -index:1000;filter:alpha(opacity:60);opacity:0.6;display:none;";
this.selectDiv.id = "selContainer";
document.body.appendChild(this.selectDiv);
}อื่น{
this.selectDiv = document.getElementById("selContainer");
-
this.startX = posXY(evt).x;
this.startY = posXY(evt).y;
this.isSelect = จริง;
-
RegionSelect.prototype.onSelect = ฟังก์ชั่น (evt) {
var _self = นี่;
ถ้า(_self.isSelect){
ถ้า (_self.selectDiv.style.display == "ไม่มี") _self.selectDiv.style.display = "";
var posX = posXY(evt).x;
var poxY = posXY(evt).y;
_self.selectDiv.style.left = Math.min(posX, this.startX);
_self.selectDiv.style.top = Math.min(poxY, this.startY);
_self.selectDiv.style.width = Math.abs(posX - this.startX);
_self.selectDiv.style.height = Math.abs(poxY - this.startY);
var ภูมิภาครายการ = _self.regions;
สำหรับ (var i=0; i< RegionList.length; i++){
var r = ภูมิภาครายการ [i], sr = _self.innerRegion(_self.selectDiv,r);
ถ้า (sr && r.className.indexOf (_self.selectedClass) == -1){
r.className = r.className + " "+_self.selectedClass;
_selectedRegions.push(r);
}else if(!sr && r.className.indexOf(_self.selectedClass) != -1){
r.className = r.className.replaceAll(_self.selectedClass,"");
_selectedRegions.remove(r);
-
-
-
-
RegionSelect.prototype.onEnd = function(){
ถ้า(this.selectDiv){
this.selectDiv.style.display = "ไม่มี";
-
this.isSelect = เท็จ;
//_selectedRegions = this.selectedRegion;
-
// 判断一个区域是否在选择区内
RegionSelect.prototype.innerRegion = ฟังก์ชั่น (selDiv, ภูมิภาค){
var s_top = parseInt(selDiv.style.top);
var s_left = parseInt(selDiv.style.left);
var s_right = s_left + parseInt(selDiv.offsetWidth);
var s_bottom = s_top + parseInt(selDiv.offsetHeight);
var r_top = parseInt(ภูมิภาค.offsetTop);
var r_left = parseInt(ภูมิภาค.offsetLeft);
var r_right = r_left + parseInt(ภูมิภาค.offsetWidth);
var r_bottom = r_top + parseInt(region.offsetHeight);
var t = Math.max(s_top, r_top);
var r = Math.min(s_right, r_right);
var b = Math.min(s_bottom, r_bottom);
var l = Math.max(s_left, r_left);
ถ้า (b > t+5 && r > l+5) {
ภูมิภาคขากลับ;
} อื่น {
กลับเป็นโมฆะ;
-
-
RegionSelect.prototype.clearSelections = ฟังก์ชั่น (ภูมิภาค) {
สำหรับ(var i=0; i<regions.length;i++){
ภูมิภาค[i].className = ภูมิภาค[i].className.replaceAll(this.selectedClass,"");
-
-
ฟังก์ชัน getSelectedRegions(){
กลับ _ภูมิภาคที่เลือก;
-
ฟังก์ชั่น showSelDiv(){
var selInfo = "";
var arr = getSelectedRegions();
สำหรับ(var i=0; i<arr.length;i++){
selInfo += arr[i].innerHTML+"/n";
-
alert("共选择 "+arr.length+" 个文件,分别是:/n"+selInfo);
-
// ]]></สคริปต์>
<p><button onclick="showSelDiv();">getRegions</button></p>
<div>ไฟล์1</div>
<div>ไฟล์2</div>
<div>ไฟล์3</div>
<div>ไฟล์4</div>
<div>ไฟล์5</div>
<div>ไฟล์6</div>
<div>ไฟล์7</div>
<div>ไฟล์8</div>
<div style="float: left; width: 100%;"><button onclick="showSelDiv();">getRegions</button></div>
<script type="text/javascript">// <![CDATA[
เลือกภูมิภาคใหม่ ({
ภูมิภาค: 'div.fileDiv',
คลาสที่เลือก: 'seled'
}).เลือก();
// ]]></สคริปต์>