<textarea></textarea>标签的placeholder属性不生效问题
<textarea></textarea>标签的placeholder属性不生效问题
1、在用到<textarea></textarea>标签时,设置placeholder属性提示不生效问题解决办法;
2、代码里写<textarea rows="10" name="List" class="box" placeholder="请输入提示文案"></textarea>在页面上看不到效果,首先检查<textarea></textarea>标签中间有没有空格,应删除空格;
3、例如<textarea></textarea>和<textarea> </textarea> //<textarea>空格删除</textarea>,因为空格相当于输入了一个空格;
4、如果以上还未能解决问题,placeholder属性在审查元素里都没有,代码里明明写了,首先查出placeholder属性被干掉的原因,其次真的需要这个提示,就模拟一个placeholder属性的提示;
5、代码如下:
<style>
.box{width: 100%;margin: 0 auto;position:relative;}
#textArea{width:100%;position:relative;z-index:9;}//层级要高于tips,透明背景
.tips{position:absolute;top:5px;left: 5px;color:#999;z-index:1;}//
</style>
<div class="box">
<textarea id="textArea" rows="10"></textarea>
<span class="tips">请输入提示文案</span> //增加一条文本用css定位到<textarea></textarea>标签内部
</div>
//用jq的
<script>
//提示
$("html").click(function(){
var isFocus=$("#textArea").is(":focus");
if($("#textArea").val() !=""||isFocus){
$("#textArea").css({"background-color":"white"})
}else{
$("#textArea").css({"background-color":"transparent"})
}
})
</script>
此时模拟出placeholder属性的提示
长风破浪会有时,直挂云帆济沧海