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

◇组件名称:

    消除表单默认值

◇功能描述：

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

◇调用方法：

    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;
      }
    }
  }
}

◇DEMO演示

    点此打开DEMO