JS实现矩形区域多选效果代码示例

矩形多选功能代码实现

<html> <head> <base href="<%=basePath%>"> <title>大屏屏幕</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <link href="<%=path%>/css/font.css" rel="stylesheet" type="text/css" />  <style type="text/css"> <!-- body { scrollbar-face-color: #E9F1F7; /*面部颜色*/ scrollbar-shadow-color: #D8E2E7; /*内边框右下*/ scrollbar-highlight-color: #FFFFFF; /*内边框左上*/ scrollbar-3dlight-color: #96AABD; /*外边框左上*/ scrollbar-darkshadow-color: #96AABD; /*外边框右下*/ scrollbar-track-color: #e2e7eb; /*底部颜色*/ scrollbar-arrow-color: #96AABD; /*三角头*/ background-color: #F1F4F7; } --> </style> </head> <body onselectstart="return false" oncontextmenu="window.event.returnValue=false" onmouseup=main_mouseup()> <center>  </center> <!-- strat id<input type=text value="" id="startid" name="startid" /> end id<input type=text value="" id="endid" name="endid" /> --> </body> </html>

注意：使用Ctrl+A进行全选操作。此处代码示例依赖于引入外部JavaScript文件，因此在加载页面后需要手动刷新一次，代码才能正常执行。