【消除表单默认值】表单获得焦点后默认值消失

 

◇组件名称:

    消除表单默认值

◇功能描述：

   表单获得焦点后默认值消失，失去焦点后默认值出现。

◇调用方法：

    addLoadEvent(stripeTables);

◇上下文情景：

    很多表单都有默认值，用于提示输入内容。当表单获得焦点时，应该自动去除默默人内容，方便用户输入数据。当表单失去焦点时，如果表内没有内容，应重新设置表单内容为默认值。

◇工作方式&技术要点

    ·遍历表单所有元素，跳过“提交”按钮和没有默认值的元素。
    ·其他元素添加一个事件处理函数：把钙元素设置为空。
    ·为“失去焦点元素”添加事件处理函数：如元素值为空，将其改回该元素的默认值。 

◇关键代码展示

function resetFields(whichform) {  
  for (var i=0; i<whichform.elements.length; i++) {  
    var element = whichform.elements[i];  
    if (element.type == "submit") continue;  
    if (!element.defaultValue) continue;  
    element.onfocus = function() {  
    if (this.value == this.defaultValue) {  
      this.value = "";  
     }  
    }  
    element.onblur = function() {  
      if (this.value == "") {  
        this.value = this.defaultValue;  
      }  
    }  
  }  
}