1.自定义右键菜单：
1 <!DOCTYPE HTML>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 <title>无标题文档</title>
6 <style>
7 * {margin:0; padding:0; list-style:none;}
8 #div1 {position:absolute; width:80px; background:#CCC; border:1px solid black; display:none;}
9 </style>
10 <script>
11 document.oncontextmenu=function (ev)
12 {
13 var oEvent=ev||event;
14 var oDiv=document.getElementById(‘div1‘);
15
16 oDiv.style.display=‘block‘;
17 oDiv.style.left=oEvent.clientX+‘px‘;
18 oDiv.style.top=oEvent.clientY+‘px‘;
19
20 return false;
21 };
22
23 document.onclick=function ()
24 {
25 var oDiv=document.getElementById(‘div1‘);
26
27 oDiv.style.display=‘none‘;
28 };
29 </script>
30 </head>
31 <body>
32 <div id="div1">
33 <ul>
34 <li>aaa</li>
35 <li>bbb</li>
36 <li>ccc</li>
37 <li>ddd</li>
38 </ul>
39 </div>
40 </body>
41 </html>
2、只能输入数字的文本框：
1 <script>
2 window.onload=function ()
3 {
4 var oTxt=document.getElementById(‘txt1‘);
5
6 oTxt.onkeydown=function (ev)
7 {
8 var oEvent=ev||event;
9 //alert(oEvent.keyCode);
10 //0- 48
11 //9- 57
12 //如果 用户按的 不是退格 并且 也不是数字
13
14 if(oEvent.keyCode!=8 && (oEvent.keyCode<48 || oEvent.keyCode>57))
15 {
16 return false;
17 }
18 };
19 };
20 </script>
21 </head>
22 <body>
23 <input type="text" id="txt1" />
3、拖拽：
1 <style>
2 #div1 {width:200px; height:200px; background:red; position:absolute;}
3 </style>
4 <script>
5 window.onload=function ()
6 {
7 var oDiv=document.getElementById(‘div1‘);
8
9 var disX=0;
10 var disY=0;
11
12 oDiv.onmousedown=function (ev)
13 {
14 var oEvent=ev||event;
15
16 disX=oEvent.clientX-oDiv.offsetLeft;
17 disY=oEvent.clientY-oDiv.offsetTop;
18
19 document.onmousemove=function (ev)
20 {
21 var oEvent=ev||event;
22 var l=oEvent.clientX-disX;
23 var t=oEvent.clientY-disY;
24
25 if(l<0)
26 {
27 l=0;
28 }
29 else if(l>document.documentElement.clientWidth-oDiv.offsetWidth)
30 {
31 l=document.documentElement.clientWidth-oDiv.offsetWidth;
32 }
33
34 if(t<0)
35 {
36 t=0;
37 }
38 else if(t>document.documentElement.clientHeight-oDiv.offsetHeight)
39 {
40 t=document.documentElement.clientHeight-oDiv.offsetHeight;
41 }
42
43 oDiv.style.left=l+‘px‘;
44 oDiv.style.top=t+‘px‘;
45 };
46
47 document.onmouseup=function ()
48 {
49 document.onmousemove=null;
50 document.onmouseup=null;
51 };
52
53 return false;
54 };
55 };
56 </script>
57 </head>
58 <body>
59 <div id="div1"></div>
时间： 2024-11-03 20:58:12