HTML事件监听和绑定

第一种直接注册鼠标点击事件监听 e是回调的事件，通常用来判断事件的具体类型和信息

$('#test_refresh').click(function (e) {
testTable.fnDraw(true);
});

第二种使用on注册事件:鼠标按下事件on函数的第一个参数是，事件类型，第二个是要监听的子元素的类型（如果有的话）

$("#test_table").on('mousedown', 'tbody tr td',function (e) {
var _this=$(this);
if (e.which == 3) {
e.which == 3表示鼠标右键点击
});

第三种 绑定事件

$('#username').bind('input propertychange', function() {  
    $('#result').html($(this).val().length + ' characters');  
});  

oninput,onpropertychange,onchange的用法
onchange触发事件必须满足两个条件：
a）当前对象属性改变，并且是由键盘或鼠标事件激发的（脚本触发无效）
b）当前对象失去焦点(onblur)；
onpropertychange的话，只要当前对象属性发生改变，都会触发事件，但是它是IE专属的；
oninput是onpropertychange的非IE浏览器版本，支持firefox和opera等浏览器，但有一点不同，它绑定于对象时，并非该对象所有属性改变都能触发事件，它只在对象value值发生改变时奏效。
js事件绑定的几种方式与on()、bind()的区别
一直不是很理解几种js事件绑定之间的区别与联系，今天百度了一下，在此做一总结：
1.如果只是简单的绑定一个事件，可以直接写在行内，点击执行一个函数，例如 点我啊
2.也可以设置一个id 例如点我啊
$(‘#btn’).click(function(){ }) 3.还可以写成这种格式，点击执行函数，但是函数写在外面，例如 btn1.onclick = demo; function demo(){ alert(‘打你干吗?’); } 其实以上三种本质应该是一种，只是形式不一样 对于多事件的绑定，我用的最多的就是on() 和 bind(),一下介绍一下它们的区别 on的基本语法：on(events,[selector],[data],fn) events:一个或多个用空格分隔的事件类型和可选的命名空间，如”click”或”keydown.myPlugin” 。 selector:一个选择器字符串用于过滤器的触发事件的选择器元素的后代。如果选择器为null或省略，当它到达选定的元素，事件总是触发。 data:当一个事件被触发时要传递event.data给事件处理函数。 fn:该事件被触发时执行的函数。 false 值也可以做一个函数的简写，返回false。 如果只是一个简单的事件绑定如$(‘button’).on(‘click’,function(){}); 与bind()无二样，与以上的几种方式也没有太多的区别
如果是多个事件绑定到一个函数，或则多个事件绑定到多个函数，就需要用到on了：
多个事件一个函数：
$(document).ready(function(){$(“p”).on(“mouseover mouseout”,function(){
alert(“多个事件一个函数”);
});
});
多个事件绑定不同的函数

$(document).ready(function(){
  $("p").on({
    mouseover:function(){$("body").css("background-color","lightgray");},  
    mouseout:function(){$("body").css("background-color","lightblue");}, 
    click:function(){$("body").css("background-color","yellow");}  
  });
});

on的第二个参数可以阻止一些情况下的冒泡，原理简单说就是用选择器来精确到匹配到你想执行函数的那个元素,而bind()就没有这个参数，因此在使用bind()时很可能产生冒泡
很多资料上显示：bind() live() delegate()都是通过.on()来实现的，虽然不是很懂，但是在使用中我也是更喜欢使用on()
js 键盘记录实现(兼容FireFox和IE)
http://www.jb51.net/article/22001.htm 参考