【前端JS】input textarea 默认文字，点击消失

如题。前端页面的 input textarea 有时候须要显示默认文字以提示用户，下面为实现代码，以 input 为例。textarea 能够直接搬用

HTML

<input type="text" id="content" name="content" value="请输入内容"/>

CSS

<style type="text/css">#content{color:#ccc; }
</style>

JavaScript

<script>       $("#content").focus(function(){if(this.value == this.defaultValue) {this.value='';$(this).css('color','#000');}});$("#content").blur(function(){if(this.value == '') {this.value=this.defaultValue;$(this).css('color','#ccc');}});});
</script>

End .

【前端JS】input textarea 默认文字，点击消失相关推荐

html表单框内文字点击消失,jQuery 使用label实现点击表单input，提示文字消失的示例...
感兴趣的小伙伴,下面一起跟随512笔记的小编罗X来看看吧. 很多网站在填写表单的时候,都可以看到这样一种UI,input[type=text]里面有提示的文字,当鼠标点进去之后提示文字就消失了.以前做 ...
echarts 默认显示图例_echarts图例组件点击显示功能(默认功能点击消失)
var myChart = echarts.init(document.getElementById('main')); var option = { title: { text: '折线图堆叠' } ...
html在背景上自动打字,Js制作点击输入框时默认文字消失的效果
为了提高用户体验和易用度,一些设计师会对网页中用户经常用的东西进行优化,比如输入框.一般的输入框是怎样优化的呢?从用户体验的角度出发,简化用户使用步骤,让用户用得更方便就是提高了易用性,例如当鼠标悬浮 ...
阿发你好java_191122_01 纯前端JS实现的文字验证码
纯前端JS实现的文字验证码作者:邵发本文是Java学习指南系列教程的官方配套文档.内容介绍一种基于JavaScript绘制的纯前端实现的验证码技术.本文附带项目源码及相关JAR包. 1. 验证码 ...
input/textarea 输入框点击有边框解决方法
input/textarea 输入框点击出现类似以下的默认边框第一种方法(直接添加样式) input{outline: none;} 第二种方法(控制聚焦时不出现边框) input:focus{ou ...
前端实现input标签输入框密码框显示文字效果
背景:各种登录网址账号密码输入框中的显示文字效果,当点击输入框时,显示的文字消失,当离开输入框后再次显示默认的文字思路:采用 input 标签,给它设置 CSS 样式,这里本人将两个 input 标 ...
inupt textarea提示文字（点击消失，不输入恢复）及限制字数
原文地址为: inupt textarea提示文字(点击消失,不输入恢复)及限制字数效果: input: textarea: 限100字源码: input: <input name=&quo ...
如何制作点击输入框时默认文字消失的效果
为了提高用户体验和易用度,一些设计师会对网页中用户经常用的东西进行优化,比如输入框.一般的输入框是怎样优化的呢?从用户体验的角度出发,简化用户使用步骤,让用户用得更方便就是提高了易用性,例如当鼠标悬浮 ...
解决 textarea 没有value 无法显示默认文字
html中textarea标签对于这个标签,不存在value属性,这就无法使该文本域不能显示默认文字,让人纠结.今天用到了这个标签,要使他显示默认为文字,搞了半天找不到其value属性,后来经百度发 ...
php 修改select标签,JS修改input,textarea,select标签的可读可写属性
通过JS修改input,textarea,select标签的可读可写属性首先,控制input,与textarea只读属性是 readonly 在js中可以这样去改变,这里要注意js中O要大写 re ...

【前端JS】input textarea 默认文字，点击消失

【前端JS】input textarea 默认文字，点击消失相关推荐

最新文章

热门文章