var placeholder = function ($element) {

        var $ = window.jQuery;
var version = parseFloat($.browser.version);
var isIE8 = $.browser.msie && version < 9; var text = $element.attr("cm-placeholder") || $element.attr("placeholder"); if (isIE8) { var $placeholderContainer = $element.closest("div");
$placeholderContainer.css({"position": "relative"}); window.setTimeout(function () { var getFakePlaceHolder = function () {
var cmPlaceholderId = $element.attr("cm-placeholder-id");
var $fakePlaceholder;
if (cmPlaceholderId && cmPlaceholderId.length > 0) {
$fakePlaceholder = $placeholderContainer.find("#" + cmPlaceholderId);
if ($fakePlaceholder && $fakePlaceholder.length > 0) {
return $fakePlaceholder;
}
} var cm_placeholder_id = uniqueId("cm-placeholder-");
var fakePlaceholder = '<span id="' + cm_placeholder_id + '" class="cm-placeholder">' + text + '</span>';
$fakePlaceholder = $(fakePlaceholder);
$placeholderContainer.append($fakePlaceholder); $fakePlaceholder.on("click", function (e) {
e.stopPropagation();
$element.focus();
}); $element.on('focus', function () {
$fakePlaceholder.hide();
}).on('blur', function () {
showFakePlaceholderIfNoText();
});
$element.attr("cm-placeholder-id", cm_placeholder_id); return $fakePlaceholder;
}; var $fakePlaceholder = getFakePlaceHolder(); var showFakePlaceholderIfNoText = function () {
if ($element.val() === '') { var ep = $element.position(); var top = ep.top+2; //- wp.top;
var left = ep.left + 10; //- wp.left;
var height = $element.height() - 2; $fakePlaceholder.css({
'top': top + 'px',
'left': left + 'px',
"height": height + "px",
"line-height": height + "px",
"display":"block",
"position":"absolute",
"color":"#999",
"font-size":"12px"
});
$fakePlaceholder.show(); } else {
$fakePlaceholder.hide();
}
}; showFakePlaceholderIfNoText(); }, 0); } else {
$element.attr("placeholder", text || "");
} };

【JavaScript】允许IE8使用placeholder的更多相关文章

  1. 让ie8支持 placeholder 属性

    一.  ie8支持 placeholder 属性 /* * ie8支持 placeholder 属性 */ $(function(){ if( !('placeholder' in document. ...

  2. IE8兼容placeholder的方案

    用JavaScript解决Placeholder的IE8兼容问题 placeholder属性是HTML5新添加的属性,当input或者textarea设置了该属性后,该值的内容将作为灰色提示显示在文本 ...

  3. 【Javascript】IE8兼容 背景图片与a标签的onclick事件

    先说几句牢骚话. 虽然IE8比之IE6.7有很大的进步,但是在执行效率.兼容性上仍然有很多问题.被广大开发者喜爱的平台才是好平台. 可惜多亏当年盗版XP打开中国的计算机市场,IE作为一款捆绑软件仍然在 ...

  4. 解决ie8下面placeholder显示问题

    今天测试反馈一个bug,需要在ie8下面看到placeholder提示,开始的想法是对ie8进行降级处理,在ie8下面就不显示了. 现在测试反馈了,解决办法. function isLowIE() { ...

  5. 让IE8支持placeholder

    $(function(){ if(!placeholderSupport()){ // 判断浏览器是否支持 placeholder $('[placeholder]').focus(function( ...

  6. javascript 在ie8中报“缺少标识符、字符串或数字“问题再现:

    开发和测试使用Chrome浏览器比较多,客户反馈某个页面打不开,自己用Chrome打开一切正常,用ie8打开,果然页面展现卡在那儿了,并且报了"缺少标识符.字符串或数字".查看是在 ...

  7. 原创-兼容IE8的placeholder

    !function (o) { o.fn.extend({ PlaceHolder: function () { var _isEmpty = function (val) { return (val ...

  8. ie8中使用placeholder

    placeholder 是 html5 中的新属性,考虑到还有不少 ie8 的用户,所以找了一个 ie8 的 placeholder 的补丁,如下: <script type="tex ...

  9. 使ie8正常支持placeholder

    在IE8下测试,发现一个问题placeholder不被支持,下面是解决IE支持placeholder的方法,本文引用的jquery是1.12.0测试通过,先引用jquery <script ty ...

随机推荐

  1. 使用 NGUI 实现头顶文字及血条

    以下是 NGUI HUD Text 实现的: 基本原理: 1. 在角色头顶绑一个点 Pivot,用于对齐 2. 因为界面总是覆盖在人物头顶信息的上面,所以将 UIRoot 分为2个 Panel:1) ...

  2. javascript this 代表的上下文,JavaScript 函数的四种调用形式

    JavaScript 是一种脚本语言,支持函数式编程.闭包.基于原型的继承等高级功能.其中JavaScript 中的 this 关键字,就是一个比较容易混乱的概念,在不同的场景下,this会化身不同的 ...

  3. 博文推荐】Javascript中bind、call、apply函数用法

    [博文推荐]Javascript中bind.call.apply函数用法 2015-03-02 09:22 菜鸟浮出水 51CTO博客 字号:T | T 最近一直在用 js 写游戏服务器,我也接触 j ...

  4. linux概念之/etc

    [Thu Apr 02 15:04:32 1028 /dev/pts/0 192.168.2.250 /etc]#ll |grep -v "^d"|wc -l99[Thu Apr ...

  5. mysql join的方式结果集

    一张图说明  left join, right join, inner join, full outer join

  6. mysql将字符转换成数字

    在操作mysql时,经常需要将字符转换成数字,这一步虽然简单,但不常用的话也很容易忘记,现将在网上找到的方法记录如下: 1.将字符的数字转成数字,比如'0'转成0可以直接用加法来实现例如:将pony表 ...

  7. spring mvc 利用匿名内部类构建返回json对象

    @RequestMapping(value = "/order/findOrderByIdVague/{noId}.json", method = {RequestMethod.G ...

  8. bootstrap3-typeahead 自动补全

    很酷的一个自动补全插件 http://twitter.github.io/typeahead.js 在bootstrap中使用typeahead插件,完成自动补全 相关的文档:https://gith ...

  9. ASP.NET 将数据生成PDF (二)

    可以下载itextsharp(https://sourceforge.net/projects/itextsharp)下载,然后在工程中引用该控件,举例子如下 1  datatable 的内容转换为P ...

  10. Jquery获得下拉框的值

    转自:http://blog.csdn.net/jing_xin/article/details/8007794 获取Select : 获取select 选中的 text : $("#ddl ...