复代码代码如下:
<스타일><!--
body{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{테두리:1px 단색 #ff0000;배경색:#D6DFF7;}
--></style>
<script type="text/javascript">// <![CDATA[
Array.prototype.remove = 함수( 항목 ){
for( var i = 0 ; i < this.length ; i++ ){
if( 항목 == this[i] )
부서지다;
}
if( i == this.length )
반품;
for( var j = i ; j < this.length - 1 ; j++ ){
이것[ j ] = 이것[ j + 1 ];
}
this.길이--;
}
String.prototype.replaceAll = 함수(AFindText,ARepText){ raRegExp = new RegExp(AFindText,"g"); return this.replace(raRegExp,ARepText);}
함수 getAllChildren(e) {
e.all을 반환 ? e.all : e.getElementsByTagName('*');
}
document.getElementsBySelector = 함수(선택기) {
if (!document.getElementsByTagName) {
새로운 배열()을 반환합니다.
}
var 토큰 = selector.split(' ');
var currentContext = new Array(문서);
for (var i = 0; i < tokens.length; i++) {
토큰 = 토큰[i].replace(/^/s+/,'').replace(//s+$/,'');;
if (token.indexOf('#') > -1) {
var 비트 = token.split('#');
var 태그이름 = 비트[0];
var id = 비트[1];
var 요소 = document.getElementById(id);
if (tagName && element.nodeName.toLowerCase() != tagName) {
새로운 배열()을 반환합니다.
}
currentContext = 새로운 배열(요소);
계속하다;
}
if (token.indexOf('.') > -1) {
var 비트 = token.split('.');
var 태그이름 = 비트[0];
var className = 비트[1];
if (!태그이름) {
태그이름 = '*';
}
var 발견 = 새 배열;
varfoundCount = 0;
for (var h = 0; h < currentContext.length; h++) {
var 요소;
if (태그 이름 == '*') {
elements = getAllChildren(currentContext[h]);
} 또 다른 {
elements = currentContext[h].getElementsByTagName(tagName);
}
for (var j = 0; j < elements.length; j++) {
발견[foundCount++] = 요소[j];
}
}
currentContext = 새 배열;
var currentContextIndex = 0;
for (var k = 0; k < 발견.길이; k++) {
if (found[k].className &&found[k].className.match(new RegExp('//b'+className+'//b'))) {
currentContext[currentContextIndex++] = 발견[k];
}
}
계속하다;
}
if (token.match(/^(/w*)/[(/w+)([=~/|/^/$/*]?)=?"?([^/]"]*)"?/ ]$/)) {
var tagName = RegExp.$1;
var attrName = RegExp.$2;
var attrOperator = RegExp.$3;
var attrValue = RegExp.$4;
if (!태그이름) {
태그이름 = '*';
}
var 발견 = 새 배열;
varfoundCount = 0;
for (var h = 0; h < currentContext.length; h++) {
var 요소;
if (태그 이름 == '*') {
elements = getAllChildren(currentContext[h]);
} 또 다른 {
elements = currentContext[h].getElementsByTagName(tagName);
}
for (var j = 0; j < elements.length; j++) {
발견[foundCount++] = 요소[j];
}
}
currentContext = 새 배열;
var currentContextIndex = 0;
var checkFunction;
스위치(attrOperator) {
'='인 경우:
checkFunction = function(e) { return (e.getAttribute(attrName) == attrValue); };
부서지다;
경우 '~':
checkFunction = function(e) { return (e.getAttribute(attrName).match(new 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;
for (var k = 0; k < 발견.길이; k++) {
if (checkFunction(found[k])) {
currentContext[currentContextIndex++] = 발견[k];
}
}
계속하다;
}
태그이름 = 토큰;
var 발견 = 새 배열;
varfoundCount = 0;
for (var h = 0; h < currentContext.length; h++) {
var elements = currentContext[h].getElementsByTagName(tagName);
for (var j = 0; j < elements.length; j++) {
발견[foundCount++] = 요소[j];
}
}
currentContext = 발견;
}
currentContext를 반환합니다.
}
함수 addEvent(eventType,eventFunc,eventObj){
eventObj = eventObj || 문서;
if(window.attachEvent) eventObj.attachEvent("on"+eventType,eventFunc);
if(window.addEventListener) eventObj.addEventListener(eventType,eventFunc,false);
}
함수 클리어이벤트버블(evt){
evt = evt || 창.이벤트;
if (evt.stopPropagation) evt.stopPropagation(); 그렇지 않으면 evt.cancelBubble = true;
if (evt.preventDefault) evt.preventDefault(); 그렇지 않으면 evt.returnValue = false;
}
함수 posXY(이벤트){
이벤트 = 이벤트 || 창.이벤트;
var posX = event.pageX || (이벤트.클라이언트X +
(document.documentElement.scrollLeft || document.body.scrollLeft));
var posY = event.pageY || (이벤트.클라이언트Y +
(document.documentElement.scrollTop || document.body.scrollTop));
{x:posX, y:posY}를 반환합니다.
}
var _selectedRegions = [];
함수 RegionSelect(selRegionProp){
this.regions =[];
var _regions = document.getElementsBySelector(selRegionProp["region"]);
if(_regions && _regions.length > 0){
var _self = 이것;
for(var i=0; i< _regions.length;i++){
_regions[i].onmousedown = 함수(){
var evt = window.event || 인수[0];
if(!evt.shiftKey && !evt.ctrlKey){
// 清空所有select样式
_self.clearSelections(_regions);
this.className += " "+_self.selectedClass;
// 清공선택됨数组，并加入当前선택중적원素
_selectedRegions = [];
_selectedRegions.push(this);
}또 다른{
if(this.className.indexOf(_self.selectedClass) == -1){
this.className += " "+_self.selectedClass;
_selectedRegions.push(this);
}또 다른{
this.className = this.className.replaceAll(_self.selectedClass,"");
_selectedRegions.remove(this);
}
}
ClearEventBubble(evt);
}
this.regions.push(_regions[i]);
}
}
this.selectedClass = selRegionProp["selectedClass"];
this.selectedRegion = [];
this.selectDiv = null;
this.startX = null;
this.startY = null;
}
RegionSelect.prototype.select = 함수(){
var _self = 이것;
addEvent("mousedown",function(){
var evt = window.event || 인수[0];
_self.onBeforeSelect(evt);
ClearEventBubble(evt);
},문서);
addEvent("mousemove",function(){
var evt = window.event || 인수[0];
_self.onSelect(evt);
ClearEventBubble(evt);
},문서);
addEvent("mouseup",function(){
_self.onEnd();
},문서);
}
RegionSelect.prototype.onBeforeSelect = 함수(evt){
if(!document.getElementById("selContainer")){
this.selectDiv = document.createElement("div");
this.selectDiv.style.cssText = "위치:절대;너비:0px;높이:0px;글꼴 크기:0px;마진:0px;패딩:0px;테두리:1px 점선 #0099FF;배경색:#C3D5ED;z -색인:1000;필터:알파(불투명도:60);불투명도:0.6;디스플레이:없음;";
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 = true;
}
RegionSelect.prototype.onSelect = 함수(evt){
var _self = 이것;
if(_self.isSelect){
if(_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;
for(var i=0; i< RegionList.length; i++){
var r = 지역목록[i], sr = _self.innerRegion(_self.selectDiv,r);
if(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 = 함수(){
if(this.selectDiv){
this.selectDiv.style.display = "없음";
}
this.isSelect = 거짓;
//_selectedRegions = this.selectedRegion;
}
// 判断一个区域是否재选择区内
RegionSelect.prototype.innerRegion = 함수(selDiv, 지역){
var s_top = parsInt(selDiv.style.top);
var s_left = parsInt(selDiv.style.left);
var s_right = s_left +parseInt(selDiv.offsetWidth);
var s_bottom = s_top +parseInt(selDiv.offsetHeight);
var r_top = parsInt(region.offsetTop);
var r_left = parsInt(region.offsetLeft);
var r_right = r_left + parsInt(region.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);
if (b > t+5 && r > l+5) {
반환 지역;
} 또 다른 {
null을 반환;
}
}
RegionSelect.prototype.clearSelections = 함수(지역){
for(var i=0; i<regions.length;i++){
지역[i].className = 지역[i].className.replaceAll(this.selectedClass,"");
}
}
함수 getSelectedRegions(){
_selectedRegions를 반환합니다.
}
함수 showSelDiv(){
var selInfo = "";
var arr = getSelectedRegions();
for(var i=0; i<arr.length;i++){
selInfo += arr[i].innerHTML+"/n";
}
Alert("共选择 "+arr.length+" 个文件，分别是：/n"+selInfo);
}
// ]]></script>
<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: 왼쪽; 너비: 100%;"><button onclick="showSelDiv();">getRegions</button></div>
<script type="text/javascript">// <![CDATA[
새로운 지역선택({
지역:'div.fileDiv',
selectedClass: '셀드'
}).선택하다();
// ]]></script>