不用alert弹出窗口的方法来显示验证信息
最近由于工作的需要在开发公司内部的OA系统，无意中发现以前的系统或多或少存在一些不太友善的操作，其中一个对每个操作的返回信息——以类似JS中alert的方法弹出系统内置的对话框提示。相信很多朋友现在还会用这种传统的方法。但个人觉得此方法在当今WEB 2.0的潮流中不但给用户在视觉上产生审美疲劳，同时也会增加用户的操作（至少要按一下键盘或者点一下鼠标才能取消话框）。于是本人简单设计了一个更友善的技巧来替换此传统的方法。下面用一个简单的文本输入验证为例——



打开演示地址

该实例中“页面路径”输入框是必填的，所以当输入为空并按“验证”按钮时，提示信息会在页面上方动态显示，并稍后自动消失。这样，用户既能看到反馈信息，又省去了点击对话框的功夫。下面列出关键的源码部分——

var T_result;
function F_resultShow(rText,rStyle,P_TObj){
 var resultID = ’resultShow’;
 if($(’#’+resultID).html()){
  $(’#’+resultID).remove();
  clearTimeout(T_result);
 }
 else{
  var resultShow = $(’<div></div>’);
  with(resultShow){
  attr(’id’,resultID);
  html(rText);
  addClass(rStyle);
  prependTo(P_TObj);
  }
  T_result = setTimeout("F_resultShow(’"+rText+"’,’"+rStyle+"’,’"+P_TObj+"’)",1500);
 }
}
其中，“P_TObj”是提示信息在哪显示，实例中是在body中显示，所以用’body’。如果想要在某个对象中显示，可以赋值为$(’#对象ID’)。而为了增加一些视觉上的UI效果，实例中还添加了鼠标聚焦到输入框的动态背景显示，对应源码——

 //------------- 输入框的鼠标事件 ----------------
 with($(’input[type=text]’)){
  focus(function(){
  $(this).removeClass(’input_1’);
  $(this).addClass(’input_2’);
  });
  blur(function(){
  $(this).removeClass(’input_2’);
  $(this).addClass(’input_1’);
  });
 }
 //---------------------------------------------

------解决方案--------------------
错误的时候就显示提示，正确的时候把错误信息隐藏就ok
------解决方案--------------------
结贴率啊 再次强调