网站首页 > 基础教程 正文
完美解决textarea输入框提示文字,必须添加默认内容
<input/>有placeholder标签,可以添加提示文字 ,但是<textarea>没有;所以提出以下解决方案
1.
<textarea id="t" rows="20" cols="20"></textarea> <script> var t = document.getElementById('t'); let aaa = '项目需求概要'; t.innerHTML=aaa; t.onfocus = function(){ if(this.value == aaa){this.value = ''} }; t.onblur = function(){ if(this.value == ''){ this.value = aaa; } }; </script>
2.
<textarea cols="50" rows="5" id="textarea" onfocus="if(value=='限100字'){value=''}" onblur="if (value ==''){value='限100字'}">限100字</textarea>
3.
这你需要把id='note'的div 定位到textarea上面
<div style="position:relative;"> <textarea class="textarea" onfocus="document.getElementById('note').style.display='none'" onblur="if(value=='')document.getElementById('note').style.display='block'"></textarea> <div id="note" class="note"> <font color="#777">项目需求概要</font> </div> </div>
4.
<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>
猜你喜欢
- 2024-10-12 纯JS手写轮播图(代码逻辑清晰,通俗易懂)
- 2024-10-12 谷歌浏览器任意文件访问漏洞(CVE-2023-4357)复现
- 2024-10-12 Dom节点优化方案 dom节点树例题
- 2024-10-12 自动化测试工程师的学习方法和逻辑
- 2024-10-12 Web Components 系列(八)——自定义组件的样式设置
- 2024-10-12 JavaScript,自制弹窗(练习) js弹出自定义窗口
- 2024-10-12 掌握 onmouseover 事件:打造动态 HTML 体验
- 2024-10-12 Vue 自定义指令详解-按钮级权限示例(干货)
- 2024-10-12 windows本地程序调用与selenium的简单应用
- 2024-10-12 中高级渗透测试员都必须掌握的Web安全测试知识库,速收藏!
- 最近发表
- 标签列表
-
- gitpush (61)
- pythonif (68)
- location.href (57)
- tail-f (57)
- pythonifelse (59)
- deletesql (62)
- c++模板 (62)
- css3动画 (57)
- c#event (59)
- linuxgzip (68)
- 字符串连接 (73)
- nginx配置文件详解 (61)
- html标签 (69)
- c++初始化列表 (64)
- exec命令 (59)
- canvasfilltext (58)
- mysqlinnodbmyisam区别 (63)
- arraylistadd (66)
- node教程 (59)
- console.table (62)
- c++time_t (58)
- phpcookie (58)
- mysqldatesub函数 (63)
- window10java环境变量设置 (66)
- c++虚函数和纯虚函数的区别 (66)