input标签placeholder
1.input里面的placeholder属性,在pc端用的特别好,但是万恶的ie8,placeholder竟然不支持。于是找到一种方法解决在ie8中placeholder无效的事
$(function() { // 如果不支持placeholder,用jQuery来完成 if(!isSupportPlaceholder()) { // 遍历所有input对象, 除了密码框 $("input").not("input[type="password"]").each( function() { var self = $(this); var val = self.attr("placeholder"); input(self, val); } ); /** * 对password框的特殊处理 * 1.创建一个text框 * 2.获取焦点和失去焦点的时候切换 */ $("input[type="password"]").each( function() { var pwdField = $(this); var pwdVal = pwdField.attr("placeholder"); var pwdId = pwdField.attr("id"); // 重命名该input的id为原id后跟1 pwdField.after(""); var pwdPlaceholder = $("#" + pwdId + "1"); pwdPlaceholder.show(); pwdField.hide(); pwdPlaceholder.focus(function(){ pwdPlaceholder.hide(); pwdField.show(); pwdField.focus(); }); pwdField.blur(function(){ if(pwdField.val() == "") { pwdPlaceholder.show(); pwdField.hide(); } }); } ); } }); // 判断浏览器是否支持placeholder属性 function isSupportPlaceholder() { var input = document.createElement("input"); return "placeholder" in input; } // jQuery替换placeholder的处理 function input(obj, val) { var $input = obj; var val = val; $input.attr({value:val}); $input.focus(function() { if ($input.val() == val) { $(this).attr({value:""}); } }).blur(function() { if ($input.val() == "") { $(this).attr({value:val}); } }); }
注:本文借鉴https://www.cnblogs.com/2010m... 本文仅供个人学习使用
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/114165.html
摘要:三创建时发现这么一句话,不知其什么意思,百度如下这样写可以达到的效果是如果安装了,则使用来渲染页面,如果没安装,则使用最高版本的内核进行渲染。 在网站开发中不免因为各种兼容问题苦恼,针对兼容问题,其实IE给出了解决方案Google也给出了解决方案百度也应用了这种方案去解决IE的兼容问题 百度源代码如下 ; 百度一下,你就知道 var wpo={start:new Date*1...
摘要:三创建时发现这么一句话,不知其什么意思,百度如下这样写可以达到的效果是如果安装了,则使用来渲染页面,如果没安装,则使用最高版本的内核进行渲染。 在网站开发中不免因为各种兼容问题苦恼,针对兼容问题,其实IE给出了解决方案Google也给出了解决方案百度也应用了这种方案去解决IE的兼容问题 百度源代码如下 ; 百度一下,你就知道 var wpo={start:new Date*1...
摘要:三创建时发现这么一句话,不知其什么意思,百度如下这样写可以达到的效果是如果安装了,则使用来渲染页面,如果没安装,则使用最高版本的内核进行渲染。 在网站开发中不免因为各种兼容问题苦恼,针对兼容问题,其实IE给出了解决方案Google也给出了解决方案百度也应用了这种方案去解决IE的兼容问题 百度源代码如下 ; 百度一下,你就知道 var wpo={start:new Date*1...
摘要:三创建时发现这么一句话,不知其什么意思,百度如下这样写可以达到的效果是如果安装了,则使用来渲染页面,如果没安装,则使用最高版本的内核进行渲染。 在网站开发中不免因为各种兼容问题苦恼,针对兼容问题,其实IE给出了解决方案Google也给出了解决方案百度也应用了这种方案去解决IE的兼容问题 百度源代码如下 ; 百度一下,你就知道 var wpo={start:new Date*1...
摘要:在搞一个门户网站的项目,最近忽然发现首页在兼容模式下和下显示都有很大的问题,而之前没有这个问题。而在兼容模式下出问题,需要加入就可以了。 在搞一个门户网站的项目,最近忽然发现首页在360兼容模式下和IE8下显示都有很大的问题,而之前没有这个问题。 百度了一下,有人说在head中加入:可以解决, 但这并不能完全解决我的问题。 经过研究,我发现用取代上头的代码,会有很好的效果,具体原因...
阅读 2247·2021-09-30 09:48
阅读 3616·2021-09-24 10:27
阅读 1758·2021-09-22 15:32
阅读 2001·2021-08-09 13:44
阅读 3557·2019-08-30 15:55
阅读 1003·2019-08-29 17:12
阅读 1895·2019-08-29 17:05
阅读 2899·2019-08-29 13:43