清除输入字段onfocus

时间:2013-01-18 23:13:30

标签: text input clear onblur onfocus

我在创建一些函数来清除onfocus上的输入字段时遇到问题,如果它是空的,则将其重置为默认文本onblur。它可以正常工作,直到你改变一些文本,然后退出它。

我的职能是:

function enterField (id, defaultText) {
   if (document.getElementById(id).value == defaultText) {
      document.getElementById(id).setAttribute("value", "");
      document.getElementById(id).style.color = "#000000";
   }
}

function leaveField (id, defaultText) {
   if (document.getElementById(id).value == "" || document.getElementById(id).value == defaultText) {
      document.getElementById(id).setAttribute("value", defaultText);
      document.getElementById(id).style.color = "#dddddd";
  }
}

我的HTML是:

<table style="width: 464px; margin-right: -7px; margin-left: -7px; table-layout: fixed;" cellpadding="0" cellspacing="8">
    <tr>
        <td class="input"><input id="name" type="text" class="name" size="32" value="Name" onfocus="enterField('name', 'Name');" onblur="leaveField('name', 'Name');"></td>
        <td class="input"><input id="email" type="text" class="name" size="32" value="Email" onfocus="enterField('email', 'Email');" onblur="leaveField('email', 'Email');"></td>
    </tr>
    <tr>
        <td class="input" colspan="2"><textarea id="message" class="message" rows="8" onfocus="enterField('message', 'Message');" onblur="leaveField('message', 'Message');">Message</textarea></td>
    </tr>
    <tr>
        <td style="text-align: right;" colspan="2"><input id="submit" type="submit" class="button" value="Send"></td>
    </tr>
</table>

您可以在www.ag-designs.ca/index_new.php查看其运作方式。点击底部的“让我们聊聊”。

1 个答案:

答案 0 :(得分:0)

变化

document.getElementById(id).setAttribute("value", defaultText);

document.getElementById(id).value = defaultText;

在你的职能中出现两次。