今天,就分享一下我自己总结的一些JS的小技巧:

①防止鼠标选中事件

<div class="mask" onselectstart="return false"></div>
<div class="link">
    <a href="javascrip;;">登录</a>
</div>

给元素添加了onslectstart=“return false",就可以防止鼠标选中事件。

②给动态添加的元素绑定事件

1
2
3
4
5
6
$(document).on('click',".large",slide);
//第一个参数表示的是对应事件,第二个是需要绑定事件的元素的id或class,第三个是绑定的对应的事件函数名
 
function slide(){
//...
}

③兼容IE浏览器的透明度处理

1
2
3
4
5
6
.ui{
     width:100%;
     height:100%;
     opacity:0.4;
     filter:Alpha(opacity=40);//兼容IE浏览器的处理
}

④使用常用的居中、全屏JS函数

    //获取元素
function getElement(ele){
return document.getElementById(ele);
}
//自动居中函数
function autoCenter(el){
var bodyX=document.documentElement.offsetWidth||document.body.offsetWidth;
var bodyY=document.documentElement.offsetHeight||document.body.offsetHeight; var elementX=el.offsetWidth;
var elementY=el.offsetHeight; el.style.left=(bodyX-elementX)/2+'px';
el.style.top=(bodyY-elementY)/2+'px';
}

⑤在输入框输入完内容并按回车的时候进行判断。比如说输入完11000在按下回车的时候。

<input type="textbox" id="textbox1" onkeypress="CheckInfo" />

    <script language="javascript" type="text/javascript">
    function CheckInfo()
    {
    if (event.keyCode==13) { 
alert(textbox1.text); 

    }
    </script>

介绍事件冒泡机制的网站:

http://www.jb51.net/article/29106.htm

http://www.360doc.com/content/11/0322/11/2923250_103458975.shtml

JS处理事件小技巧的更多相关文章

  1. Node.js 调试小技巧

    小技巧--使用 supervisor如果你有 PHP 开发经验,会习惯在修改 PHP 脚本后直接刷新浏览器以观察结果,而你在开发 Node.js 实现的 HTTP 应用时会发现,无论你修改了代码的哪一 ...

  2. 一些js的小技巧

    这里收集了一些编码上的小技巧,大家可以学习学习. 1.浮点转整型 使用|0快速转换 var a=(12.002)|0;//12 使用~~快速转换 ~取反运算符,2=0010,~2=1101,因为第一位 ...

  3. Js的小技巧

    感谢好友破狼提供的这篇好文章,也感谢写这些知识点的作者们和将他们整理到一起的作者.这是github上的一篇文章,在这里本兽也就只做翻译,由于本兽英语水平和编程能力都不咋地,如有不好的地方也请多理解体谅 ...

  4. JS firebug小技巧

    实际上前端的发展与进步也离不开浏览器的支持,而对于开发者来讲,浏览器最好的支持,就是对于debug的良好支持,甚至在某些兴许接手的项目中,前端的debug甚至能够解决好多问题--不说了,都是泪啊!还是 ...

  5. js相关小技巧

    1.清空type=file的input文件上传控件的内容,相当于重置.txtFile是该input的id $("#txtFile").val(""); $(&q ...

  6. Js 使用小技巧总结(1)

    1.Js 的时间控制,小于初始时间,大于截止时间 <script type="text/javascript">        window.onload = Game ...

  7. js 一些小技巧

    Javascript 中的 绑定事件 on $(document).on("事件","元素","方法"): Js 定时方法 1.setTim ...

  8. JS常用小技巧

    iframe子窗口调用父窗口方法 parent.functionName(); 二.iframe 父窗口和子窗口相互的调用方法 1.IE中使用方法: 父窗口调用子窗口:iframe_ID.iframe ...

  9. js 实用小技巧

    https://blog.csdn.net/www93111/article/details/76176771

随机推荐

  1. html5 canvas常用api总结(三)--图像变换API

    canvas的图像变换api,可以帮助我们更加方便的绘画出一些酷炫的效果,也可以用来制作动画.接下来将总结一下canvas的变换方法,文末有一个例子来更加深刻的了解和利用这几个api. 1.画布旋转a ...

  2. Python高手之路【五】python基础之正则表达式

    下图列出了Python支持的正则表达式元字符和语法: 字符点:匹配任意一个字符 import re st = 'python' result = re.findall('p.t',st) print( ...

  3. video.js

    1.github地址 2.常用API: class : video-js: video-js应用视频所需的风格.js功能,比如全屏和字幕. vjs-default-skin: vjs-default- ...

  4. 关于VS2015 ASP.NET MVC添加控制器的时候报错

    调试环境:VS2015 数据库Mysql  WIN10 在调试过程中出现类似下两图的同学们,注意啦. 其实也是在学习的过程中遇到这个问题的,找了很多资料都没有正面的解决添加控制器的时候报错的问题,还是 ...

  5. My TWI

    前言 对TWI没有什么特别的印象,因为有一个更出名的TWU,而我去年又刚好错过了它,因此TWU的光辉完全掩盖了TWI.对TWI印象最深的是在邮件中看到的38th北京的这期,看到他们的图文记录,在圈子中 ...

  6. CRL快速开发框架系列教程十二(MongoDB支持)

    本系列目录 CRL快速开发框架系列教程一(Code First数据表不需再关心) CRL快速开发框架系列教程二(基于Lambda表达式查询) CRL快速开发框架系列教程三(更新数据) CRL快速开发框 ...

  7. [C#] C# 知识回顾 - 表达式树 Expression Trees

    C# 知识回顾 - 表达式树 Expression Trees 目录 简介 Lambda 表达式创建表达式树 API 创建表达式树 解析表达式树 表达式树的永久性 编译表达式树 执行表达式树 修改表达 ...

  8. 代码的坏味道(20)——过度耦合的消息链(Message Chains)

    坏味道--过度耦合的消息链(Message Chains) 特征 消息链的形式类似于:obj.getA().getB().getC(). 问题原因 如果你看到用户向一个对象请求另一个对象,然后再向后者 ...

  9. javaScript中的小细节-script标签中的预解析

    首先介绍预解析,虽然预解析字面意思很好理解,但是却是出坑出的最多的地方,也是bug经常会有的地方,利用好预解析的特性可以解决很多问题,并且提高代码的质量及数量,浏览器在解析代码前会把变量的声明和函数( ...

  10. wireshark 相关提示

    Packet size limited during capture      提示说明标记的包没有抓全,在某些操作系统中,默认只抓96个字节,tcpdump中有"-s"参数可用于 ...