jquery同一标签绑定多个事件的几种方式 && js实时监听input中值变化

jquery同一标签绑定多个事件的几种方式
①$(document).ready(function(){
    $("button").bind({
        click:function(){$("p").slideToggle()},
        mouseover:function(){$("body").css("background-color","red");},
        mouseout:function(){$("body").css("background-color","#fffffff")};
    });
});

②$(function(){
    $('#btn').bind("click",function(){
        $("#test").append("

我的绑定函数1

"); }),bind("click",function(){ $("#test").append("

我的绑定函数2

"); }),bind("click",function(){ $("#test").append("

我的绑定函数3

") }); }); ③为元素一次性绑定多个事件类型 $(function(){ $("div").bind("mouseover mouseout",function(){ $(this).toggleClass("over"); }); }); js实时监听input中值变化
 
 
 
    RunJS    

实时监测input中值的变化

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

上述功能类似于,实现微博的‘还能输入xxx个字符’

oninput,onpropertychange,onchange的用法

onchange触发事件必须满足两个条件:

a)当前对象属性改变,并且是由键盘或鼠标事件激发的(脚本触发无效)

b)当前对象失去焦点(onblur);

onpropertychange的话,只要当前对象属性发生改变,都会触发事件,但是它是IE专属的

oninput是onpropertychange的非IE浏览器版本,支持firefox和opera等浏览器,但有一点不同,它绑定于对象时,并非该对象所有属性改变都能触发事件,它只在对象value值发生改变时奏效。

 

 

 

 

 

 

 

 

 

 

 

 

 

你可能感兴趣的:(JS&&Jquery)