この記事では、JavaScriptの例を共有して、マウスボックス選択操作を実装しています。特定のコンテンツは次のとおりです
複製画像：
コード：
<html> <head> </head> <style> body {padding：100px;} .filediv {float：left; width：100px; height：100px; text-align：center-height：100px; font-size：12px; border：1px solid＃ccc; magnid-right：1px solid：1px-right：10px; magne-righn red; background-color：＃d6dff7;} </style> <スクリプトタイプ= "text/javascript">（function.onmousedown = function（）{var sellenodes = document.getelementsbytagname（ "div"）; （i] .classname.indexof（ "filenodes =" filediv "; （evt.y || evt.clienty）; var seldiv.createelement（ "div"）; ＃0099ff; background-color：＃c3d5ed; z-index：1000; filter：alpha（ofacity：60）; ofacity：0.6; display：none; "; seldiv.id =" selectdiv "; document.body.appendchild（seldiv）; seldiv.style.left = stardiv.style.tyle.tyle.tyle.tyle.tyle.tyle.tyle.tyle. _x = null _ null（evt） evt.clientx）; seldiv.style.height = math.abs（_y -starty） + "px"; ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ = selDiv.offsetTop; var _w = selDiv.offsetWidth, _h = seldiv.offseetheight; _w && sellist [i] .offsettop <_t + _h）{if（sellist [i] .classname.indexof（ "seled"）== -1）{sellassname = sellist [i] .classname + "seled"}} sellist [i] classname = "filediv"; null、startx = null、starty = null、evt = null;関数ClearEventBubble（evt）{if（evt.stoppropagation）evt.stoppropagation（）; else evt.cancelbubble = true; if（evt.preventdefault）evt.preventdefault（）; else evt.returnvalue = false; }関数showseldiv（arr）{var count = 0; var selinfo = ""; for（var i = 0; i <arr.length; i ++）{if（arr [i] .classname.indexof（ "seled"）！= -1）{count ++; selinfo + = arr [i] .innerhtml + "/n"; }} alert（ "select" + count + "ファイル： /n" + selinfo）; } </script> <body> <div> file1 </div> <div> div> div> <div> file3 </div> <div> div> <div> div> file5 </div> <div> div> div> div> div </div> <div> file8 </div> <div> div> </html> </html> </html> </html> </html>上記はこの記事に関するものです。すべての人の学習に役立つことを願っています。