复制代码代码如下:
<gaya><!--
body{padding-atas:50px;padding-kiri:100px;padding-kanan: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: 10 piksel;}
.seled{border:1px solid #ff0000;warna latar:#D6DFF7;}
--></gaya>
<skrip type="teks/javascript">// <![CDATA[
Array.prototipe.hapus = fungsi( item ){
for( var i = 0 ; i < ini.panjangnya ; i++ ){
jika( barang == ini[i] )
merusak;
}
if( i == ini.panjang )
kembali;
for( var j = i ; j < ini.panjang - 1 ; j++ ){
ini[ j ] = ini[ j + 1 ];
}
ini.panjang--;
}
String.prototype.replaceAll = fungsi (AFindText,ARepText){ raRegExp = RegExp baru(AFindText,"g"); kembalikan ini.ganti(raRegExp,ARepText);}
fungsi getAllChildren(e) {
kembalikan semuanya? e.semua : e.getElementsByTagName('*');
}
document.getElementsBySelector = fungsi(pemilih) {
if (!document.getElementsByTagName) {
kembalikan Array baru();
}
var token = selector.split(' ');
var currentContext = Array baru(dokumen);
for (var i = 0; i < tokens.length; i++) {
token = token[i].replace(/^/s+/,'').replace(//s+$/,'');;
if (token.indexOf('#') > -1) {
var bit = token.split('#');
var tagName = bit[0];
var id = bit[1];
var elemen = dokumen.getElementById(id);
if (tagName && elemen.nodeName.toLowerCase() != tagName) {
kembalikan Array baru();
}
currentContext = Array baru(elemen);
melanjutkan;
}
if (token.indexOf('.') > -1) {
var bit = token.split('.');
var tagName = bit[0];
var className = bit[1];
jika (!namatag) {
tagNama = '*';
}
var ditemukan = Array baru;
var jumlah ditemukan = 0;
for (var h = 0; h < currentContext.length; h++) {
elemen var;
jika (namatag == '*') {
elemen = getAllChildren(currentContext[h]);
} kalau tidak {
elemen = Konteks saat ini[h].getElementsByTagName(tagName);
}
for (var j = 0; j < elemen.panjang; j++) {
ditemukan[foundCount++] = elemen[j];
}
}
Konteks saat ini = Array baru;
var currentContextIndex = 0;
for (var k = 0; k < ditemukan.panjang; k++) {
if (ditemukan[k].className && ditemukan[k].className.match(RegExp baru('//b'+className+'//b'))) {
currentContext[currentContextIndex++] = ditemukan[k];
}
}
melanjutkan;
}
if (token.match(/^(/w*)/[(/w+)([=~/|/^/$/*]?)=?"?([^/]"]*)"?/ ]$/)) {
var tagName = RegExp.$1;
var attrName = RegExp.$2;
var attrOperator = RegExp.$3;
var attrValue = RegExp.$4;
jika (!namatag) {
tagNama = '*';
}
var ditemukan = Array baru;
var jumlah ditemukan = 0;
for (var h = 0; h < currentContext.length; h++) {
elemen var;
jika (namatag == '*') {
elemen = getAllChildren(currentContext[h]);
} kalau tidak {
elemen = Konteks saat ini[h].getElementsByTagName(tagName);
}
for (var j = 0; j < elemen.panjang; j++) {
ditemukan[foundCount++] = elemen[j];
}
}
Konteks saat ini = Array baru;
var currentContextIndex = 0;
var checkFungsi;
beralih (attrOperator) {
kasus '=':
checkFunction = function(e) { return (e.getAttribute(attrName) == attrValue); };
merusak;
kasus '~':
checkFunction = function(e) { return (e.getAttribute(attrName).match(new RegExp('//b'+attrValue+'//b'))); };
merusak;
kasus '|':
checkFunction = function(e) { return (e.getAttribute(attrName).match(new RegExp('^'+attrValue+'-?'))); };
merusak;
kasus '^':
checkFunction = function(e) { return (e.getAttribute(attrName).indexOf(attrValue) == 0); };
merusak;
kasus '$':
checkFunction = function(e) { return (e.getAttribute(attrName).lastIndexOf(attrValue) == e.getAttribute(attrName).length - attrValue.length); };
merusak;
kasus '*':
checkFunction = function(e) { return (e.getAttribute(attrName).indexOf(attrValue) > -1); };
merusak;
bawaan :
checkFunction = function(e) { return e.getAttribute(attrName); };
}
Konteks saat ini = Array baru;
var currentContextIndex = 0;
for (var k = 0; k < ditemukan.panjang; k++) {
if (checkFunction(ditemukan[k])) {
currentContext[currentContextIndex++] = ditemukan[k];
}
}
melanjutkan;
}
tagNama = tanda;
var ditemukan = Array baru;
var jumlah ditemukan = 0;
for (var h = 0; h < currentContext.length; h++) {
var elemen = Konteks saat ini[h].getElementsByTagName(tagName);
for (var j = 0; j < elemen.panjang; j++) {
ditemukan[foundCount++] = elemen[j];
}
}
currentContext = ditemukan;
}
kembalikan Konteks saat ini;
}
fungsi addEvent(eventType,eventFunc,eventObj){
acaraObj = acaraObj || dokumen;
if(window.attachEvent) eventObj.attachEvent("on"+eventType,eventFunc);
if(window.addEventListener) eventObj.addEventListener(eventType,eventFunc,false);
}
fungsi clearEventBubble(evt){
kejadian = kejadian || jendela.acara;
if (evt.stopPropagation) evt.stopPropagation(); lain evt.cancelBubble = benar;
if (evt.preventDefault) evt.preventDefault(); lain evt.returnValue = false;
}
fungsi posXY(peristiwa){
peristiwa = peristiwa || jendela.acara;
var posX = acara.halamanX || (acara.clientX +
(document.documentElement.scrollLeft || document.body.scrollLeft));
var posY = acara.halamanY || (acara.klienY +
(document.documentElement.scrollTop || document.body.scrollTop));
kembalikan {x:posX, y:posY};
}
var _selectedRegion = [];
fungsi RegionSelect(selRegionProp){
this.wilayah =[];
var _regions = document.getElementsBySelector(selRegionProp["wilayah"]);
if(_wilayah && _wilayah.panjang > 0){
var _self = ini;
for(var i=0; i< _regions.length;i++){
_wilayah[i].onmousedown = fungsi(){
var evt = jendela.acara || argumen[0];
if(!evt.shiftKey && !evt.ctrlKey){
// 清空所有pilih样式
_self.clearSelections(_region);
this.className += " "+_self.selectedClass;
// 清空pilihan数组，并加入当前pilih中的元素
_Wilayah yang dipilih = [];
_selectedRegions.push(ini);
}kalau tidak{
if(ini.namakelas.indexOf(_self.selectedClass) == -1){
this.className += " "+_self.selectedClass;
_selectedRegions.push(ini);
}kalau tidak{
this.className = ini.className.replaceAll(_self.selectedClass,"");
_selectedRegions.remove(ini);
}
}
clearEventBubble(evt);
}
this.regions.push(_regions[i]);
}
}
this.selectedClass = selRegionProp["selectedClass"];
this.wilayah yang dipilih = [];
this.selectDiv = null;
ini.startX = null;
ini.mulaiY = null;
}
RegionSelect.prototype.select = fungsi(){
var _self = ini;
addEvent("mousedown",fungsi(){
var evt = jendela.acara || argumen[0];
_self.onBeforeSelect(evt);
clearEventBubble(evt);
},dokumen);
addEvent("gerakan mouse",fungsi(){
var evt = jendela.acara || argumen[0];
_self.onSelect(evt);
clearEventBubble(evt);
},dokumen);
addEvent("mouseup",fungsi(){
_self.onEnd();
},dokumen);
}
RegionSelect.prototype.onBeforeSelect = fungsi(evt){
if(!document.getElementById("selContainer")){
this.selectDiv = dokumen.createElement("div");
this.selectDiv.style.cssText = "posisi:absolute;lebar:0px;tinggi:0px;ukuran font:0px;margin:0px;padding:0px;border:1px putus-putus #0099FF;warna latar:#C3D5ED;z -index:1000;filter:alpha(opacity:60);opacity:0.6;tampilan:tidak ada;";
this.selectDiv.id = "selContainer";
document.body.appendChild(ini.selectDiv);
}kalau tidak{
this.selectDiv = document.getElementById("selContainer");
}
this.startX = posXY(evt).x;
this.startY = posXY(evt).y;
this.isSelect = benar;
}
RegionSelect.prototype.onSelect = fungsi(evt){
var _self = ini;
if(_self.isSelect){
if(_self.selectDiv.style.display == "tidak ada") _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 regionList = _self.regions;
for(var i=0; i< regionList.length; i++){
var r = Daftar wilayah[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 = fungsi(){
if(ini.pilihDiv){
this.selectDiv.style.display = "tidak ada";
}
this.isSelect = salah;
//_selectedRegion = ini.selectedRegion;
}
// 判断一个区域是否在选择区内
RegionSelect.prototype.innerRegion = fungsi(selDiv, wilayah){
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(wilayah.offsetTop);
var r_left = parseInt(wilayah.offsetLeft);
var r_right = r_left + parseInt(region.offsetWidth);
var r_bottom = r_top + parseInt(wilayah.offsetHeight);
var t = Matematika.max(s_top, r_top);
var r = Matematika.min(s_kanan, r_kanan);
var b = Matematika.min(s_bottom, r_bottom);
var l = Matematika.max(s_kiri, r_kiri);
jika (b > t+5 && r > l+5) {
wilayah kembali;
} kalau tidak {
kembalikan nol;
}
}
RegionSelect.prototype.clearSelections = fungsi(wilayah){
for(var i=0; i<wilayah.panjang;i++){
wilayah[i].className = wilayah[i].className.replaceAll(this.selectedClass,"");
}
}
fungsi getSelectedRegions(){
kembalikan _wilayah yang dipilih;
}
fungsi tampilkanSelDiv(){
var selInfo = "";
var arr = getSelectedRegions();
for(var i=0; i<arr.panjang;i++){
selInfo += arr[i].innerHTML+"/n";
}
alert("共选择 "+arr.length+" 个文件,分别是：/n"+selInfo);
}
// ]]></skrip>
<p><button onclick="showSelDiv();">getRegion</button></p>
<div>file1</div>
<div>file2</div>
<div>file3</div>
<div>file4</div>
<div>file5</div>
<div>file6</div>
<div>file7</div>
<div>file8</div>
<div style="float: left; width: 100%;"><button onclick="showSelDiv();">getRegions</button></div>
<skrip type="teks/javascript">// <![CDATA[
Pilihan Wilayah baru({
wilayah:'div.fileDiv',
Kelas yang dipilih: 'dipilih'
}).memilih();
// ]]></skrip>