`
wzf7065
  • 浏览: 249248 次
  • 性别: Icon_minigender_2
  • 来自: 北京
社区版块
存档分类
最新评论

textarea中提示文本的实现,默认显示,点击消失

 
阅读更多

有时我们在输入框中给用户提示一些内容,这些内容默认显示,用户点击后消失,现在也有些网站点击了也不消失,但是不消失的文本并不会被写入服务器。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<HEAD>
<script type="text/javascript">

        //提示内容:(默认值)
        var c = '请输入内容:';
        
        function on_focus(obj){
            obj.value = obj.value==(!!arguments[1]?arguments[1]:c)?'':obj.value;
        } 
        
        function on_blur(obj){
            obj.value = obj.value==''?(!!arguments[1]?arguments[1]:c):obj.value;
        }
</script>

</HEAD>

<BODY>
<textarea rows="10" cols="100" id="AAA" value="hahahhaha" onfocus="clearText()" onblur="Write()"></textarea>


<textarea name="test1" cols="30" rows="10" id="test1" onfocus="on_focus(this)" onblur="on_blur(this)">请输入内容:</textarea>
<textarea name="test2" cols="30" rows="10" id="test2" onfocus="on_focus(this,'提示内容:test')" onblur="on_blur(this,'提示内容:test')">提示内容:test</textarea>
<textarea name="test3" cols="30" rows="10" id="test3" onfocus="on_focus(this,'提示内容:abc')" onblur="on_blur(this,'提示内容:abc')">提示内容:abc</textarea>

</BODY>

 

来源:bbs.csdn.net/topics/370125298

 

分享到:
评论

相关推荐

    asp.net后台实现文本框提示文字

    通过以上步骤,我们就实现了ASP.NET后台控制文本框提示文字的功能,使得提示文字在鼠标点击时消失,鼠标离开后重新出现,且提示文字为灰色,输入文本时为黑色字体。这种方法不仅提高了用户体验,而且代码结构清晰,...

    vue + el-input 中 textarea 实现 placeholder 换行

    在HTML中,`placeholder`属性用于设置输入框或文本区域内的提示文本,当用户聚焦到输入框时显示,用户开始输入后则消失。默认情况下,`placeholder`的文本是单行显示的,但我们可以利用CSS来实现多行`placeholder`...

    用CSS实现textArea中的placeholder换行功能

    通过`content`属性,我们定义了需要插入的文本,`\A`是一个在CSS中表示换行的Unicode字符,因此可以在placeholder文本中实现换行效果。`display: block;`确保了:after伪元素能够占满整个文本区域,而`color: red;`则...

    输入框灰色提示字体效果

    在非IE浏览器中,这段代码将展示一个输入框,其中显示“请输入您的姓名”,用户点击或聚焦输入框后,提示文字会自动消失。但在IE浏览器中,这个功能就需要通过JavaScript或其他方法来实现。 在这个名为“input框...

    《程序天下:JavaScript实例自学手册》光盘源码

    3.45 textarea中的文本插入 3.46 查找两段文本中相同的词句 3.47 自动保存网页输出的文本 3.48 文本编辑器 第4章 鼠标特效 4.1 禁用鼠标右键 4.2 使鼠标滚轮失效 4.3 状态栏显示鼠标位置 4.4 点击鼠标右键到指定页 ...

    程序天下:JavaScript实例自学手册

    3.45 textarea中的文本插入 3.46 查找两段文本中相同的词句 3.47 自动保存网页输出的文本 3.48 文本编辑器 第4章 鼠标特效 4.1 禁用鼠标右键 4.2 使鼠标滚轮失效 4.3 状态栏显示鼠标位置 4.4 点击鼠标右键到指定页 ...

    ie6 7 8兼容html5属性placeholder

    HTML5的`placeholder`属性是现代网页开发中的一个重要特性,它允许在输入框(`&lt;input&gt;`)或文本区域(`&lt;textarea&gt;`)内提供一个提示文本,该文本会在用户聚焦元素时消失。这个功能在IE6、7、8等较老版本的Internet ...

    jquery placeholder

    在HTML5中,`placeholder`属性被引入,允许开发者在输入字段内设置一个提示文本,该文本会在用户聚焦输入框前显示,一旦用户开始输入,提示文本会自动消失。然而,一些较旧或非主流的浏览器并不支持这个特性,这就...

    JqueryPlaceHolder

    在Web开发中,`placeholder`属性是HTML5引入的一个非常实用的功能,它允许我们在输入框中设置默认提示文本,当用户点击输入框时,该文本会自动消失。然而,这个特性在一些较老的浏览器,尤其是Internet Explorer(IE...

    jquery-placeholder

    这个插件使得在输入框中显示提示文本变得简单,当用户聚焦输入框时,提示文本会自动消失,让用户能够清楚地看到输入的内容。在HTML5中,`placeholder`属性是内建的功能,但为了向后兼容,jQuery Placeholder为老版本...

    contenteditable元素的placeholder输入提示语设置方法

    这里使用了CSS的伪元素:before来向contenteditable元素内部插入默认的提示文本。当元素为空(:empty),显示灰色的提示文字“说点啥好呢?”。而当用户开始在contenteditable元素中输入内容,即元素获得焦点(:focus...

    ExtAspNet v2.2.1 (2009-4-1) 值得一看

    -为空则使用默认的提示信息,默认的提示信息支持多语言,建议一般情况下使用默认信息。 +为表单字段增加MarkInvalid和GetMarkInvalidReference函数(feedback:sun1299shine)。 -增加示例:form/form_validate....

    jQuery表单占位符动画特效插件

    在**jQuery**框架中,开发者通常使用`placeholder`属性来设置表单字段的提示文本,但默认情况下,这些提示文本在用户聚焦输入框时会立即消失。而这款插件则通过创新的方式,使占位符文本在用户交互时以各种预设的...

    ExtAspNet_v2.3.2_dll

    -为空则使用默认的提示信息,默认的提示信息支持多语言,建议一般情况下使用默认信息。 +为表单字段增加MarkInvalid和GetMarkInvalidReference函数(feedback:sun1299shine)。 -增加示例:form/form_validate....

    200多个js技巧代码

    此段代码实现了文本框默认提示信息“mm”的动态展示。当用户点击文本框时,提示信息消失;当用户离开文本框(即文本框失去焦点)且未输入任何内容时,提示信息再次出现。 #### 2. 网页按钮的颜色定制 通过CSS样式...

    jQuery控制表单输入框鼠标悬停提示效果

    在Web开发领域,jQuery是一个非常流行的JavaScript库,它极...在实际项目中,你可能需要根据具体需求调整代码,例如改变提示框的样式、延迟显示或消失时间等。通过这种方式,你可以创建出更直观、更具交互性的Web表单。

    常见的几种标签.docx

    `placeholder`属性则提供了对输入字段预期值的提示,当输入字段为空时显示,获得焦点时消失。 最后,`&lt;select&gt;`标签用于创建下拉列表,`&lt;option&gt;`标签则是下拉列表中的各个选项。例如: ```html &lt;option&gt;Option 1...

    jQuery 文本框得失焦点的简单实例

    这个版本在版本一的基础上增加了一个功能:当文本框内有默认内容(通常是提示信息)时,获得焦点后默认内容会消失,而失去焦点且未输入任何内容时,又会恢复默认内容。这里的逻辑是利用 `.val()` 方法获取和设置元素...

    纯CSS3表单必填项选择_加强所需的表单字段

    除了伪类选择器,CSS3还引入了`placeholder`属性,它可以在输入框内提供默认的提示文本,当用户开始输入时会自动消失。我们可以通过CSS调整占位符的样式: ```css input::placeholder { color: #999; font-style:...

    KODExplorer 芒果云-资源管理器

    - 文件浏览器打开(a点击新窗口跳转,a不支持click,用子元素冒泡来实现点击) - 优化配置文件存储方案。直接由前端操作后端key,value - 修复添加收藏夹问题(已打开设置窗口再添加失败问题) - 修复树目录中文...

Global site tag (gtag.js) - Google Analytics