萬盛學電腦網

 萬盛學電腦網 >> 腳本專題 >> javascript >> jquery實現郵箱自動補全功能

jquery實現郵箱自動補全功能

 這篇文章主要介紹了jquery實現郵箱自動補全功能,大家參考使用吧

 代碼如下: (function($){     $.fn.autoMail = function(options){          var autoMail = $(this);          var _value   = '';          var _index   = -1;          var _width   = autoMail.outerWidth();          var _height  = autoMail.outerHeight();          var _left    = autoMail.offset().left;          var _top     = autoMail.offset().top;          autoMail.defaults = {              deValue : '請輸入郵箱地址',              textCls : 'text-gray',              listCls : 'list-mail',              listTop : 1,              mailArr  : ["qq.com","gmail.com","126.com","163.com","hotmail.com","yahoo.com","yahoo.com.cn","live.com","sohu.com","sina.com"]          }          //初始化          autoMail.init = function(){              autoMail.vars = $.extend({},autoMail.defaults,options);              autoMail.val(autoMail.vars.deValue).addClass(autoMail.vars.textCls);              autoMail.click(function(event){                  autoMail.select().removeClass(autoMail.vars.textCls);                  if(autoMail.val() != autoMail.vars.deValue){                      autoMail.add();                      autoMail.order(_value);                      autoMail.list.find('.item').each(function(){                          if($(this).text() == autoMail.val()){                              $(this).siblings('.item').removeClass('select');                              $(this).addClass('select');                              return false;                          }                      })                  }                  event.stopPropagation();              })              autoMail.blur(function(event){                  if(autoMail.val() == '' || autoMail.val() == autoMail.vars.deValue){                      alert(autoMail.val())                      autoMail.val(autoMail.vars.deValue).addClass(autoMail.vars.textCls);                  }              })              //文本域鍵盤松開事件              autoMail.keyup(function(event){                  if($(autoMail.list).length == 0){                      autoMail.add();                  }                  if(autoMail.list.length > 0){                      var keyCode = event.keyCode;                      //alert(keyCode)                      switch(keyCode){                          case 13:                              autoMail.remove();                              autoMail.blur();                              break;                          case 38:                              _index--;                              if(_index < 0){                                  _index = 0;                              }                              autoMail.keyOperate(_index);                              break;                          case 40:                              _index++;                              if(_index > $('.item',autoMail.list).length - 1){                                  _index = ('.item',autoMail.list).length - 1                              }                              autoMail.keyOperate(_index);                              break;                          default:                              if(autoMail.val().indexOf('@') < 0){                                  _value = autoMail.val();                                  autoMail.order(_value);                                   }                          }                    }              })              $(document).click(function(){                  if($(autoMail.list).length > 0){                      autoMail.remove();                      autoMail.blur();           
copyright © 萬盛學電腦網 all rights reserved