<script>
// 事件总共有2个部分,
//1.点击鼠标右键的表现 oncontextmenu 2.点击鼠标左键的表现(即普通点击onclick)
// 点击右键,div位置定位到鼠标所在位置, 且阻止鼠标右键的默认菜单
// 点击左键(即普通的onclick点击),div消失。 document.oncontextmenu=function (ev)
// oncontextmenu 点击右键触发
{
var oEvent=ev||event;
var oDiv=document.getElementById('div1'); oDiv.style.display='block';
oDiv.style.left=oEvent.clientX+'px';
oDiv.style.top=oEvent.clientY+'px'; return false;
}; document.onclick=function ()
// onclick 正常点击时触发 (鼠标左键,任意点击页面)
{
var oDiv=document.getElementById('div1'); oDiv.style.display='none';
};
</script>

自定义右键菜单,错误记录

<style>
*{margin:0;padding:0; list-style: none;}
#div1{
background-color: #ccc;
border: 1px solid #000;
width: 80px;
display: none; position:absolute;
/* CSS没写绝对定位,就不能移动!!!不要再忘记了!!!*/
}
</style> <script> function getPos(ev) //这个函数的先后顺序有区别吗?
{
// 这里没有涉及到移出当前屏幕的滚动条情况。
var scrollTop = document.documentElement.scrollTop||document.body.scrollTop;
var scrollLeft = document.documentElement.scrollLeft||document.body.scrollLeft; //var oEvent = ev||event;
// 这个oEvent 应该是其他事件调用这个函数时使用,不是封装函数本身里的。 // return{x:oEvent.clientX + scrollLeft, y:oEvent.clientY + scrollTop};
return{x:ev.clientX + scrollLeft, y:ev.clientY + scrollTop}
} document.oncontextmenu = function (ev) // 这里没写ev!!!
{
//本条补写:
var oEvent = ev||event; var oDiv = document.getElementById('div1'); var pos = getPos(oEvent) // var pos = getPos(ev); // 如果要调用getPos函数,这里括号里怎么表示? oDiv.style.display = 'block';
oDiv.style.left = pos.x + 'px';
oDiv.style.top = pos.y + 'px'; return false;
}; document.onclick = function ()
{
var oDiv=document.getElementById('div1'); oDiv.style.display='none';
}; </script>
    window.onload = function(){
var oTxt = document.getElementById('txt1'); oTxt.onkeydown = function(ev){
//document.onkeydown = function(ev) //应该是给文本框加事件,不是document
// onkeydown这个事件不只是document可以用,在哪里按键盘了就在哪用。 var oEvent = ev||event; if(oEvent.keyCode!=8 && oEvent.keyCode<49 || oEvent.keyCode>57)
{
return false;
}
};
}

JS学习笔记 - 自定义右键菜单、文本框只能输入数字的更多相关文章

  1. js限制文本框只能输入数字方法小结(转)

    这篇文章主要分享下js代码限制文本框中只能输入数字的多个实例,学习下js控制文本框中输入数字的方法,需要的朋友可以参考下   有时需要限制文本框输入内容的类型,本节分享下正则表达式限制文本框只能输入数 ...

  2. C# 使用js正则表达式,让文本框只能输入数字和字母,最大长度5位

    使用js正则表达式,让文本框只能输入数字和字母,最大长度5位,只需要加个onkeyup事件,即可简单实现 <asp:TextBox ID="txtBegin" runat=& ...

  3. js限制文本框只能输入数字

    JS判断只能是数字和小数点1.文本框只能输入数字代码(小数点也不能输入) <input onkeyup="this.value=this.value.replace(/\D/g,'') ...

  4. js设置文本框只能输入数字

    JS判断只能是数字和小数点 1.文本框只能输入数字代码(小数点也不能输入) <input onkeyup="this.value=this.value.replace(/\D/g,'' ...

  5. js正则表达式限制文本框只能输入数字,小数点,英文字母

    1.文本框只能输入数字代码(小数点也不能输入)<input onkeyup="this.value=this.value.replace(/\D/g,'')" onafter ...

  6. js限制文本框只能输入数字方法小结

    有时需要限制文本框输入内容的类型,本节分享下正则表达式限制文本框只能输入数字.小数点.英文字母.汉字等代码. 例如,输入大于0的正整数  代码如下: <input onkeyup="i ...

  7. js限制文本框只能输入数字方法

    输入大于0的正整数 <input onkeyup="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,' ...

  8. js 文本框只能输入数字和点

    http://www.jb51.net/article/51102.htm 手机端 只能输入数字,能输小数点.且只能2位小数 oninput="this.value=this.value.r ...

  9. replace限制文本框只能输入数字,数字和字母等的正则表达式

    1.文本框只能输入数字代码(小数点也不能输入) <input onkeyup="this.value=this.value.replace(/\D/g,'')" onafte ...

随机推荐

  1. XML解析——DOM解析

    XML:可扩展性标记语言,主要用来传输和存储数据,相对于HTML的各种标签规范,XML的标签可以让用户根据语义自己进行定义,适用于web传输. JSON和XML的区别: (1).XML定义 扩展标记语 ...

  2. 【Codeforces Round #459 (Div. 2) B】 Radio Station

    [链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 用map模拟一下映射就好了. [代码] #include <bits/stdc++.h> using namespace ...

  3. [Python] Manipulate Data with Dictionaries in Python

    Dictionaries may be familiar to you as hash maps. In this lesson, you will learn how to create them, ...

  4. js -- canvas img 封装

    鼠标   1.操作canvas 中的 img. 右键放大缩小,左键移动img. 2.拖动input type= range  改变图片的透明度 html 代码 <!DOCTYPE html> ...

  5. Day5网络流

    算法 无源汇上下界可行流 先强制流过l的流量 从s到每个正权点连流量为l的流量 从每个负权点向t连-l的流量 如果容量为0,则不连边 有源汇上下界最大流 去掉下界 先求出可行流 再求S到T的最大流 有 ...

  6. button按钮下边框有立体效果样式

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. C/C++(指针数组)

    指针数组 指针数组的本质是数组,数组指针的本质是指针 一个数组中的各个元素都是字符指针,即为字符指针数组,或者指针数组. int arr[] = {1,2,23,45,6};//整形数组 char c ...

  8. Vue给元素添加样式

    Vue中使用样式 绑定css 数组 <style> .red{ color:red } .thin{ font-size:18px } </style> <h1 :cla ...

  9. init进程

    2.Linux下的三个特殊进程 Linux下有三个特殊的进程idle进程(PID=0),init进程(PID=1),和kthreadd(PID=2)idle进程由系统自动创建,运行在内核态idle进程 ...

  10. 【2017 Multi-University Training Contest - Team 3】RXD and math

    [Link]: [Description] [Solution] 发现1010mod(109+7)=999999937; 猜测答案是nk 写个快速幂; 注意对底数先取模; [NumberOf WA] ...