www.baike369.com
百科369 > JS教程 > JavaScript使用onclick事件实现文本框的删除效果

JavaScript使用onclick事件实现文本框的删除效果


JavaScript使用onclick事件实现文本框的删除效果

为了提示用户文本框的输入内容,可以为文本框设置默认值,如“请输入姓名”等。但是如果这样,用户就需要先删除这个提示,然后再输入姓名,为了方便用户操作,使用onclick事件可以实现单击文本框以后,提示内容会自动消失。


实例

下面是一个实现文本框的清除效果的例子。源代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>JavaScript使用onclick事件实现文本框的删除效果实例-www.baike369.com</title>
</head>
<body>
<input type="text" name="username" value="单击我试试" size="20" maxlength="20" onclick="this.value='';" />
</body>
</html>

显示效果如下:

JavaScript使用onclick事件实现文本框的删除效果实例

本例在文本框中使用onclick事件,触发用户单击文本框的操作:

  • “this.value”中的“this”表示当前要单击的对象,也就是当前的文本框。
  • “value”表示输入框的显示值。
Copyright© 2011-2016 www.baike369.com All Rights Reserved