关于低版本IE浏览器不支持placeholder的解决办法

最新推荐文章于 2019-09-03 10:29:34 发布

王小汪O_o

最新推荐文章于 2019-09-03 10:29:34 发布

阅读量347

点赞数

分类专栏： Java javascript 文章标签： js 前端

本文链接：https://blog.csdn.net/u010800201/article/details/82656966

版权

Java 同时被 2 个专栏收录

24 篇文章 0 订阅

订阅专栏

javascript

3 篇文章 0 订阅

订阅专栏

因为要解决浏览器兼容问题，所以不得不用js方法解决：

js代码：

function clearSearchDefault()
		{
		
			var content = document.getElementById("appName").value;
			if(content == '请输入系统名称进行搜索...')
			{	
				document.getElementById("appName").value ="";
				document.getElementById("appName").style.color="black";
			}
		}
		
		function checkDefault()
		{
			var content = document.getElementById("appName").value;
			if(content == '')
			{	
				document.getElementById("appName").value ="请输入系统名称进行搜索...";
				document.getElementById("appName").style.color="grey";
			}
		}

input代码：

<c:if test="${empty appName}">
<input type="text"  width="420" height="38" class="form-control" name="appName" id="appName" value="请输入系统名称进行搜索..." style="color:grey" onfocus="clearSearchDefault();" onblur="checkDefault();" maxlength="40" autocommplete="off" >
</c:if>

<c:if test="${!empty appName}">
<input type="text"  width="420" height="38" class="form-control" name="appName" id="appName" value="${ appName }" style="color:black" onfocus="clearSearchDefault();" onblur="checkDefault();" maxlength="40" autocommplete="off">
</c:if>

大概的思路就是如果value没有值，则通过onfocus出发clearSearchDefault代码，将value置空同时修改value颜色，失去焦点时需要判断value有没有值，如果有就不管他，如果没有则需要将引导内容回填进去，同时修改颜色