JQuery 绑定/解绑事件

单个事件绑定

$(function(){
       //方法一 直接调用事件
    $("#city").click(function() {
       alert("first click");
    });
       //方法二 使用on()方法            
    $("#city").on("click", function() {
         alert("second click");
    });
       //方法三  使用bind()方法
    $("#city").bind("click", function() {
          alert("third click");
    });
})

还有一种方法直接在标签中使用 onclick="";

多个事件绑定（不同实现方法）

$(function(){
   //链式操作绑定
   $("#city").mouseover(function(){
    $(this).css("background","blue");
    }).mouseout(function(){
    $(this).css("background","grey");
    });
    //on()方法绑定
    $("#city").on({
     mouseover:function(){
          $(this).css("background","brown");
         },
     mouseout:function(){
          $(this).css("background","aqua");
         }
    });
    //bind()方法绑定
    $("#city").bind({
      mouseover:function(){
        $(this).css("background","brown");
      },
      mouseout:function(){
        $(this).css("background","aqua");
      }
     });
})

多个事件绑定（同一方法）

$(function(){
   //on() 方法
   $("#city").on("click mouseover",function(){
          alert("test");
   });
   //bind() 方法
   $("#city").bind("click mouseover",function(){
          alert("test");
   });
})

解绑指定方法

$(function(){
    //off()方法解绑
    $("#city").off("click");
    //unbind()方法解绑
    $("#city").unbind("click");
})

解绑所有方法

$(function(){
    //off()解绑所有方法
    $("#city").off();
    //unbind()解绑所有方法
    $("#city").unbind();
});