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

本文实例讲述了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程序设计有所帮助。