jquery采用oop模式class类的使用示例

本文实例讲述了jquery采用oop模式class类的使用方法。分享给大家供大家参考，具体如下：

这里用class来管理jquery的各个function，我觉得很方便，并且代码可读性也很强。以前我喜欢建文件写function，再包括文件，到后来找一个function就比较麻烦了。没有用class来管理function方便。费话不多说了。

一、oop.html

 
 
 
 
 
 
 


 
 访问考高分网
 
 


 
 名字： 
 
 
 区域选择： 
 行政区选择
 浦东新区
 松江区
 金山区
 崇明区
 青浦区
 静安区
 徐汇区
 长宁区
 虹口区
 闸北区
 宝山区
 嘉定区
 闵行区
 普陀区
 卢湾区
 黄浦区
 杨浦区
 奉贤区
 
 
 
 

二、建一个oop.js

function oop(){
  //定义变量
  var aaa = this;
  //初始化
  this.init = function(){
    aaa.addnotice();
    aaa.unchange();
    return aaa;
  }
  //添加function
  this.addnotice = function(){
    $("input[type='text']").each(function(){
      $(this)
      .focus(function(){
 if($(this).val() == $(this).attr('notice')){
   $(this).val("");
 }
      })
      .blur(function(){
 if($(this).val() == $(this).attr('notice') || $.trim($(this).val()) == ""){
   $(this).val($(this).attr('notice'));
 }
      });
    });
  }
  //添加function
  this.cleannotice = function(){
    $("input[type='text']").each(function(){
      if($(this).val() == $(this).attr('notice')){
 $(this).val("");
      }
    });
  }
  //添加function
  this.unchange = function(){
    $(".select").bind('change',function(){
      if($(this).val() == '0'){
 alert('noselect');
      }else{
 alert($(this).val());
      }
    });
  }
}

感兴趣的自己测试一下吧

希望本文所述对大家jQuery程序设计有所帮助。