Artikel ini berbagi dengan Anda contoh JavaScript untuk mengimplementasikan operasi pemilihan kotak mouse, yang sama sekali tidak klik untuk memilih, untuk referensi Anda. Konten spesifiknya adalah sebagai berikut
Gambar reproduksi:
Kode:
<html> <head></head> <style> body{padding:100px;} .fileDiv{float:left;width:100px;height:100px;text-align:center;line-height:100px;font-size:12px;border:1px solid #ccc;margin-right:10px;margin-bottom:10px;} .seled{border:1px solid Red; latar belakang-warna:#d6dff7;} </tyle> <script type = "text/javascript"> (function () {document.onmousedown = function () {var sellist = []; var filenodes = document.geteLementsbytagname ("div"); for (var i = 0; i <filenodes.lengthy; ; (Evt.y || evt.clienty); #0099ff; latar belakang-warna: #c3d5ed; z-index: 1000; filter: alpha (opacity: 60); opacity: 0.6; tampilan: tidak ada; "; seldiv.id =" selectDiv "; document.body" px "; seldiv); seldiv.style.left = startx +" px "; seldiv); seldiv.style.left = startx +" px "; null; var _y = null; = EVT.Y || Evt.Clienty); Math.abs(_y - startY) + "px"; // ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ = seldiv.offsettop; var _w = seldiv.offsetwidth, _h = seldiv.offsetheight; && st> _t && sellist [i] .offsetleft <_l + _w && sellist [i] .offsettop <_t + _h) {if (sellist [i] .classname.indexof ("seled") == -1) {sellist [i] .classname. ; } sellist = null, _x = null, _y = null, seldiv = null, startx = null, starty = null, evt = null; fungsi cleareventbubble (evt) {if (evt.stoppropagation) evt.stoppropagation (); lain evt.cancelbubble = true; if (evt.preventdefault) evt.preventdefault (); lain evt.returnValue = false; } function showseldiv (arr) {var count = 0; var selinfo = ""; untuk (var i = 0; i <arr.length; i ++) {if (arr [i] .classname.indexof ("seled")! = -1) {count ++; selinfo + = arr [i] .innerHtml + "/n"; }} alert ("pilih" + count + "file, yaitu: /n" + selinfo); } </script> <body> <div> File1 </div> <div> File2 </div> <div> File3 </div> <verv> File4 </div> <ver> File5 </div> <div> File6 </div> </Div> </Div> </Div> </Div> </Div> </Body> </Div> </Div> </Div> File9 </Div> </Div> </Div>Di atas adalah semua tentang artikel ini, saya harap ini akan membantu untuk pembelajaran semua orang.