JS学习笔记 - 自定义右键菜单、文本框只能输入数字
<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学习笔记 - 自定义右键菜单、文本框只能输入数字的更多相关文章
- js限制文本框只能输入数字方法小结(转)
这篇文章主要分享下js代码限制文本框中只能输入数字的多个实例,学习下js控制文本框中输入数字的方法,需要的朋友可以参考下 有时需要限制文本框输入内容的类型,本节分享下正则表达式限制文本框只能输入数 ...
- C# 使用js正则表达式,让文本框只能输入数字和字母,最大长度5位
使用js正则表达式,让文本框只能输入数字和字母,最大长度5位,只需要加个onkeyup事件,即可简单实现 <asp:TextBox ID="txtBegin" runat=& ...
- js限制文本框只能输入数字
JS判断只能是数字和小数点1.文本框只能输入数字代码(小数点也不能输入) <input onkeyup="this.value=this.value.replace(/\D/g,'') ...
- js设置文本框只能输入数字
JS判断只能是数字和小数点 1.文本框只能输入数字代码(小数点也不能输入) <input onkeyup="this.value=this.value.replace(/\D/g,'' ...
- js正则表达式限制文本框只能输入数字,小数点,英文字母
1.文本框只能输入数字代码(小数点也不能输入)<input onkeyup="this.value=this.value.replace(/\D/g,'')" onafter ...
- js限制文本框只能输入数字方法小结
有时需要限制文本框输入内容的类型,本节分享下正则表达式限制文本框只能输入数字.小数点.英文字母.汉字等代码. 例如,输入大于0的正整数 代码如下: <input onkeyup="i ...
- js限制文本框只能输入数字方法
输入大于0的正整数 <input onkeyup="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,' ...
- js 文本框只能输入数字和点
http://www.jb51.net/article/51102.htm 手机端 只能输入数字,能输小数点.且只能2位小数 oninput="this.value=this.value.r ...
- replace限制文本框只能输入数字,数字和字母等的正则表达式
1.文本框只能输入数字代码(小数点也不能输入) <input onkeyup="this.value=this.value.replace(/\D/g,'')" onafte ...
随机推荐
- CSUOJ 1603 Scheduling the final examination
1603: Scheduling the final examination Time Limit: 10 Sec Memory Limit: 128 MBSubmit: 49 Solved: 1 ...
- JavaScript定时调用函数(SetInterval与setTimeout)
setTimeout和setInterval的语法同样.它们都有两个參数.一个是将要运行的代码字符串.另一个是以毫秒为单位的时间间隔,当过了那个时间段之后就将运行那段代码. 只是这两个函数还是有差别的 ...
- julia/pyplot 绘图加入标签和标题
julia 调用matplotlib.pyplot 须要先using pycall 先安装pycall Pkg.add("PyCall") 然后吧. . . 上代码把:(应该是通俗 ...
- 聊聊高并发(十八)理解AtomicXXX.lazySet方法
看过java.util.concurrent.atomic包里面各个AtomicXXX类实现的同学应该见过lazySet方法.比方AtomicBoolean类的lazySet方法 public fin ...
- vim基础学习之搜索功能
当我们使用vim看源码的时候,我们可能会碰到一个方法或者变量,我们想要知道这个变量在其他地方的使用情况.这时候我们经常的做法就是退出当前的文件,或者是重新切换一个终端,然后使用grep或者find等s ...
- android图像处理系列之六-- 给图片添加边框(下)-图片叠加
前面介绍了一种用透明图片叠加的方式添加花边边框,下面将介绍另外一种图片叠加添加花边边框的方式.前面方法有一个缺点,就是做成PNG图片,图片体积会很大,不是一般的大,比同样的JPG大三倍多,如果项目可以 ...
- 小白算法之路-非确定性多项式(non-deterministic polynomial,缩写NP)
前端小白的算法之路 时隔多日终于解决了埋在心头的一道难题,霎时云开雾散,今天把一路而来碰到的疑惑和心得都记录下来,也算是开启了自己探索算法的大门. 问题背景 曾经有一个年少轻狂的职场小白,在前端圈 ...
- 玲珑学院 1052 - See car
1052 - See car Time Limit:2s Memory Limit:64MByte Submissions:594Solved:227 DESCRIPTION You are the ...
- python try except 捕捉错误得到错误的时候的值
try: dict_reason = self.get(name,id_number,mobile,card_number,**kwargs) except RetryError as e: # 获取 ...
- 生成CPU使用率 sin 曲线 控制cpu使用率 编程之美
入职Oracle 以后想着把之前写过的<编程之美>中控制CPU使用率曲线的程序再写一边, 可是总是由于入职须要学习的东西太多, 没有时间. 程序早就写好了. 最终有机会贴出来了.o(∩∩) ...