解决placeholder在IE浏览器不兼容的问题
解决方式:加上label标签。(IE显示该标签,其他浏览器不显示。)
1.html:
<div class="fl"> <label id="oldPwdTip">为了您账户安全请修改原始密码</label> <input id="oldPwd" class="usertext" type="password" name="userName" placeholder="为了您账户安全请修改原始密码" onkeypress="hideOldPwdTip();" onblur="toggleOldPwdTip(this.value);" /> <span id="oldPwdTip2"></span> </div>
2.样式:(注意float和absolate)
.fl{ float:left; width:350px; margin-left:8px;} #oldPwdTip{ position: absolute; color : #ccc; margin-top : 6px; margin-left : 6px; }
3.IE显示label脚本:
$(function(){ /* IE浏览器的输入框提示 */ var platform = navigator.platform; var o = navigator.appName ; if (o.toString().indexOf("Internet") == -1) { document.getElementById("oldPwdTip").style.cssText = "display: none;" ; document.getElementById("newPwdTip").style.cssText = "display: none;" ; document.getElementById("repeatPwdTip").style.cssText = "display: none;" ; } });
4.按下键盘不显示,失去焦点重新显示:
function hideOldPwdTip() { document.getElementById("oldPwdTip").style.cssText = "display: none;" ; } function toggleOldPwdTip(v) { if (!v) { var o = navigator.appName ; if (o.toString().indexOf("Internet") != -1) { document.getElementById("oldPwdTip").style.cssText = "display: block;" ; } } }
Chrome:
IE:
相关推荐
以下是一个简单的jQuery插件示例,用于在不支持`placeholder`属性的IE浏览器中实现类似的功能: ```javascript (function($){ // 检查浏览器是否支持placeholder属性 if (!('placeholder' in document....
针对IE浏览器对`placeholder`属性的不兼容问题,开发者通常会采用JavaScript(JS)插件来实现兼容性处理。这些插件通过JavaScript代码模拟`placeholder`的效果,使得在IE浏览器上也能呈现类似的功能。文件名...
IE8 placeholder 兼容使用插件。可兼容password类型,可以正常显示提示字。
描述中提到的“完美兼容H5 placeholder属性在IE9及以下版本的问题”,意味着这个解决方案能够有效地在不支持`placeholder`属性的IE浏览器上模拟出相同的效果。"自测可用,修改点少"表示这个解决方案经过了实际测试,...
本文将深入探讨`placeholder`属性,以及如何通过一些解决方案来解决IE浏览器不支持的问题。 `placeholder`属性是HTML5中用于文本输入框`<input>`和文本区域`<textarea>`的一个非常有用的特性。它允许开发者在输入框...
总结起来,这个插件解决了H5`placeholder`属性在IE浏览器中的兼容性问题,通过代码封装和闭门技术实现了跨浏览器的支持。对于开发者来说,这是一个极好的学习资源,可以帮助他们提高在实际项目中处理浏览器兼容性...
但是在不支持html5的低版本的浏览器中,placeholder属性是无效的,为了解决这个问题,因此,人为的去实现placeholder属性: 复制代码代码如下: //placeholder功能实现 var placeholder = { add: function (el) { if...
HTML5.js是一个专门为老旧的...总之,HTML5.js是为了解决旧版IE浏览器与HTML5新特性的兼容问题而存在的。在实际项目中,合理运用此类工具可以提升网站的跨浏览器兼容性,但也需要注意性能优化和逐步淘汰老技术的策略。
这篇博客文章(https://alxw4616.iteye.com/blog/2098609)很可能介绍了如何利用JavaScript或者jQuery来为不支持`placeholder`属性的IE浏览器添加兼容性。通常,这种插件会监听输入框的事件,如`focus`和`blur`,并...
IE8兼容性是前端开发中经常遇到的问题,特别是在使用老版本的IE浏览器时。下面是IE8兼容性中的一些常见问题和解决方法: 首先,IE8只支持jquery2.0以下的版本,因此在使用jquery时需要注意版本问题。 其次,IE8不...
总的来说,"placeholderfriend.js"插件为开发者提供了一种便捷的方式来解决IE浏览器对`placeholder`属性的支持问题,使得在旧版IE中也能享受到与现代浏览器相似的用户体验。通过理解其工作原理和使用方法,我们可以...
许多jQuery插件如html5shiv-responsive-images、jquery.placeholder等专门用于解决IE浏览器的HTML5兼容问题。 4. **条件注释**: IE浏览器特有的条件注释允许我们针对不同版本的IE插入特定的CSS或JS代码。例如,我们...
标题中提到的知识点是"基于jQuery实现IE浏览器兼容placeholder效果"。jQuery是一个快速、小巧、功能丰富的JavaScript库,它通过简化HTML文档遍历、事件处理、动画和Ajax交互等操作,使得Web开发变得更加容易。而IE...
- CSS3 PIE:这是一个流行的JavaScript库,通过VML(Vector Markup Language)技术为旧版IE浏览器提供对CSS3边框半径、圆角、阴影等特性的支持。 - Modernizr:这是一个JavaScript库,用于检测浏览器对HTML5和CSS3...
然而,浏览器的兼容性问题一直是开发者面临的一大挑战,特别是对于较老版本的IE浏览器。`placeholder`属性是HTML5引入的新特性,它允许我们在`<input>`元素内设置提示文本,但遗憾的是,这个特性在IE8及以下版本并不...
总的来说,这个jQuery插件是一个解决浏览器兼容性问题的实用工具,使得在老版本的IE浏览器上也能实现HTML5的placeholder效果,从而提高用户体验。通过学习和使用这个插件,开发者可以更好地理解和掌握如何利用jQuery...
本文将详细介绍两种利用jQuery库快速解决input中placeholder值在IE浏览器中无法支持的方法。首先,了解在IE中placeholder无法显示的原因是IE 9以下的版本不支持该属性。为此,需要采用JavaScript脚本来模拟这一功能...
总结来说,`jquery.placeholder.js`是一个小巧而实用的jQuery插件,它解决了IE浏览器对`placeholder`属性的兼容性问题,使得无论在哪个浏览器环境下,用户都能享受到一致的用户体验。通过简单的引入和调用,以及可选...