$(function(){
//判断浏览器是否支持placeholder属性
supportPlaceholder='placeholder'in document.createElement('input'),
placeholder=function(input){
var text = input.attr('placeholder'),
defaultValue = input.defaultValue;
if(!defaultValue){
input.val(text).addClass("phcolor");
}
input.focus(function(){
if(input.val() == text){
$(this).val("");
}
});
input.blur(function(){
if(input.val() == ""){
$(this).val(text).addClass("phcolor");
}
});
//输入的字符不为灰色
input.keydown(function(){
$(this).removeClass("phcolor");
});
};
//当浏览器不支持placeholder属性时,调用placeholder函数
if(!supportPlaceholder){
$('input').each(function(){
text = $(this).attr("placeholder");
if($(this).attr("type") == "text"){
placeholder($(this));
}
});
}
});

placeholder属性兼容js支持的更多相关文章

  1. HTML5表单提示placeholder属性兼容IE

    placeholder 属性提供可描述输入字段预期值的提示信息(hint). 该提示会在输入字段为空时显示,并会在字段获得焦点时消失. 注释:placeholder 属性适用于以下的 <inpu ...

  2. placeholder属性兼容ie8

    <!doctype html> <html> <head> <meta charset="utf-8" /> <title&g ...

  3. html5 placeholder属性兼容ie11

    placeholder 属性是html5的属性,用于提供描述输入字段预期值的提示信息(hint). 简单例子: <!DOCTYPE HTML> <html> <body& ...

  4. (转)html5 Placeholder属性兼容IE6、7方法

    使低版本浏览器支持Placeholder有很多方法,都不是很完美,或多或少有点问题,且有些原生支持的浏览器在获得焦点时会清空Placeholder提示.发现zhihu的解决方法不错,特记录下 wind ...

  5. 修复IE9.0下PlaceHolder 属性问题js脚本

    在开发前端系统时候碰到这种兼容问题,以下是个人解决方案,希望能给其他人带来帮助: var JPlaceHolder = { //检测 _check: function () { return 'pla ...

  6. 兼容ie10以下版本的placeholder属性

    <script src="${ctx }/js/jquery.placeholder.js" type="text/javascript">< ...

  7. 解决input标签placeholder属性浏览器兼容性问题的一种方法

    为文本框input添加文字输入提示,H5为input提供了一个placeholder属性.在支持H5的浏览器中,用此属性设置输入提示,简单方便,但是对于IE8以下版本,都不支持placeholder属 ...

  8. 让ie支持placeholder属性,一段js搞定

    placeholder属性真的是超级好用的新属性,可惜,只有新版浏览器才支持,为了写出输入框贴心提示,老方法就是加span标签覆盖,营造出placeholder提示的感觉,现在安利一款好用的js,好用 ...

  9. 让IE下支持Html5的placeholder属性

    HTML5对Web Form做了许多增强,比如input新增的type类型.Form Validation等. Placeholder 是HTML5新增的另一个属性,当input或者textarea设 ...

随机推荐

  1. 开发日志_Jan.8.2017

    这两天继续着手开发碰撞部分. 主要工作是写碰撞类和运动线程类.碰撞主要在于算法,运动线程只要管理好就行了. 之前碰撞测试中(即还未添加完整碰撞算法时)遇到各种bug,疑似机器人和小球的定位点不明所造成 ...

  2. 第一步 配置D2RQ环境

    ​第一步 配置D2RQ环境 Getting Started 2013年10月15日 15:16:55 老套路,还是先配置环境,没查到什么中文资料,写在这里,供大家参考.有需要交流的可以加QQ: 1q7 ...

  3. AndroidAnnotations部署

    环境: 系统:windows 8 (64bit) 开发工具:Eclipse 3.8 JDK版本:jdk1.6 构建工具:Ant(Eclipse默认的build tool) androidannotat ...

  4. IOS Label 自动换行 IOS6和IOS7

    IOS 6和ios7 不一样,所以,我们分开来: IOS6: //计算实际frame大小,并将label的frame变成实际大小     CGSize size01 = [ssizeWithFont: ...

  5. Hyper-V避免使用快照

    虽然Hyper-V快照好处多多,但应该尽量少用,有两个原因,首先,如果你创建的是数据库服务器快照,你必须执行回滚,这样数据库往往会招到破坏,其次,创建快照会影响虚拟机的性能,实际上,创建快照就是创建第 ...

  6. 【剑指Offer学习】【面试题19 :二叉树的镜像】

    题目:请完毕一个函数,输入一个二叉树,该函数输出它的镜像. 二叉树结点的定义: /** * 二叉树的树结点 */ public static class BinaryTreeNode { int va ...

  7. Android ListView分页加载时图片显示问题

    场景:Android ListView需要分页加载,每个item中会有图片,图片又是从网络下载的. 问题:在滑动加载下一页时,上一页的图片明明已经下载完成了,但是无法显示出来. Bug重现: 1,加载 ...

  8. Android中滑屏实现----手把手教你如何实现触摸滑屏以及Scroller类详解

    前言:  虽然本文标题的有点标题党的感觉,但无论如何,通过这篇文章的学习以及你自己的实践认知,写个简单的滑屏小 Demo还是just so so的. 友情提示: 在继续往下面读之前,希望您对以下知识点 ...

  9. textarea文本域宽度和高度(width、height)自己主动适应变化处理

    文章来源:http://www.cnblogs.com/jice/archive/2011/08/07/2130069.html <HTML> <HEAD> <TITLE ...

  10. 给TextView添加超链接的四种方式

    因为在上上篇博客中介绍了SpannableString的使用(SpannableString使用详解),由此想到给TextView添加超链接究竟有多少种方式?经过个人总结,现在一共发现四种,如果还有其 ...