placehoder兼容

<!DOCTYPE html><html><head lang="en">    <meta charset="UTF-8">    <title></title>    <script src="http://js.40017.cn/cn/min/??/cn/public/fish.1.4.5.js,/cn/public/fc.1.1.6.js?v=082102" type="text/javascript"></script>

</head><body><!--<input class="gd_code gdCodeVer" type="text" vtype="rq" vfn="njCodeFn" data-err-rq="专属码不可为空" data-err-fn="请填写正确的专属码" placeholder="请输入您的南京银行专属码"/>--><input  type="text" id="zy" zy="请输入您的南京银行专属码"/></body><script>

//    fish.admin.config({//        verify: { v: "0.4.1", css: 1, g: 2013011701 }//    });//    function njCodeFn(val,elem){////        var newRex = /^[0-9a-zA-Z]{8}$/,//                pass = newRex.test(val);//        if(pass){//            return true;//        }//        else{//            return false;//        }//    }

    function isPlaceholder(){        var input= document.createElement(‘input‘);        return ‘placeholder‘ in input;    }

    function Placeholder(obj){        this.input = obj;        this.label =document.createElement(‘label‘);        this.label.innerHTML = obj.getAttribute(‘zy‘);        this.label.style.cssText = ‘position:absolute;text-indent:4px;color:#999;font-size:14px;‘        if(obj.value!=‘‘){            this.label.style.display=‘none‘;        }        this.init();

    }

    Placeholder.prototype = {        getxy:function(obj){            var left,top;            if(document.documentElement.getBoundingClientRect){                var html=document.documentElement,                        body=document.body,                        pos=obj.getBoundingClientRect(),                        st=html.scrollTop || body.scrollTop,                        sl=html.scrollLeft || body.scrollLeft,                        ct=html.clientTop ||body.clientTop,                        cl=html.clientLeft || body.clientLeft;                left = pos.left + sl -cl;                top = pos.top + st -ct;            }else{                while(obj){                    left += obj.offsetLeft;                    top += obj.offsetTop;                    obj = obj.offsetParent;                }            }            return{ left: left, top :top}

        },        getwh: function(obj){            return {                w:obj.offsetWidth,                h:obj.offsetHeight            }        },        setStyles:function(obj,styles){            for(var p in styles){                obj.style[p]=styles[p]+‘px‘;            }        },        init:function(){            var label=this.label,                    input=this.input,                    getXY =this.getxy,                    xy=this.getxy(input),                    wh=this.getwh(input);            this.setStyles(label,{‘width‘:wh.w,‘height‘:wh.h,‘lineHeight‘:40,‘left‘:xy.left+8,‘top‘:xy.top});            document.body.appendChild(label);            label.onclick = function(){

                this.style.display = ‘none‘;

                input.focus();

            }

            input.onfocus = function(){

                label.style.display = ‘none‘;

            };

            input.onblur = function(){

                if(this.value == ‘‘){

                    label.style.display = ‘block‘;

                }

            };

            if(window.attachEvent){                window.attachEvent("onresize",function(){                    var xy=getXY(input);                    Placeholder.prototype.setStyles(label,{‘left‘:xy.left+8,‘top‘:xy.top});                })            }else{                window.addEventListener("resize",function(){                    var xy=getXY(input);                    Placeholder.prototype.setStyles(label,{‘left‘:xy.left+8,‘top‘:xy.top});                },false);            }

        }

    }

    new Placeholder(document.getElementById(‘zy‘));

</script></html>
时间: 2024-11-08 18:28:07

placehoder兼容的相关文章

placehoder不兼容ie9以下和opero12以下

颜色设置 解决方案一: ::-webkit-input-placeholder { /* WebKit browsers */ color:#999; } :-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color:#999; } ::-moz-placeholder { /* Mozilla Firefox 19+ */ color:#999; } :-ms-input-placeholder { /* Internet Explorer 1

IE6 浏览器常见兼容问题 共23个

1.<!DOCTYPE HTML>文档类型的声明. 产生条件:IE6浏览器,当我们没有书写这个文档声明的时候,会触发IE6浏览器的怪异解析现象: 解决办法:书写文档声明. 2.不同浏览器当中,很多的标签的默认样式不同,如默认的外部丁内补丁. 产生条件:不同浏览器: 解决办法:利用CSS reset文件进行样式的清除,然后再根据需要进行设置. 3.横向双倍外边距 产生条件:在IE6中块元素浮动后,会出现横向双倍margin现象. 解决办法: 在float标签的样式控制中加入display:inl

前端浏览器JavaScript及CSS兼容总结

一. getElementById [标准参考] getElementById 是 Document 接口提供的方法,用于获取一个元素,该方法传入的参数应该是目标元素的 id 属性的值,目标元素的 id 是一个大小写敏感的字符串,并且该 id 在文档内应该是唯一的. [问题描述] 但是在 IE6 IE7 IE8(Q) 中,支持以 document.getElementById(elementName) 的方式获取 name 属性值为 elementName 的 A APPLET BUTTON F

SQL-GROUP BY语句在MySQL中的一个错误使用被兼容的情况

首先创建数据库hncu,建立stud表格. 添加数据: create table stud( sno varchar(30) not null primary key, sname varchar(30) not null, age int, saddress varchar(30) ); INSERT INTO stud VALUES('1001','Tom',22,'湖南益阳'); INSERT INTO stud VALUES('1002','Jack',23,'益阳'); INSERT

【好用的小技巧】win8兼容、网页不让复制

1.今天下了个matlab7,我用的是win8系统,不兼容. 解决:鼠标右键matlab7的快捷键,点击属性,选择兼容性,选择window vista即可运行 2.在一个 网页上看到一个对自己很有帮助的代码,想下.结果发现代码可以预览,可以选择代码中的文字,但是一复制就弹出窗口说积分不够. 解决:存储网页到本地,用word打开网页.然后文字就都可以复制了.

IE常见兼容问题

浏览器兼容问题1:不同浏览器的标签默认的外补丁和内补丁不同 问题症状:随便写1个标签,不加样式控制的情况下,胳肢的margin 和padding差异较大. 解决?案:CSS *{margin:0;padding:0;} 浏览器兼容问题2:块属性标签float后,有横?的margin情况下,在IE6显示margin比设置的大 问题症状:常见症状是IE6中后面的一块被顶到下一行 在float的标签样式控制中加 display:inline;将其转化为行内属性 浏览器兼容问题三:设置较小高度标签(一般

HTML+CSS+JS实现TABLE固定列(常见浏览器兼容)的最佳实践

BS架构的企业级应用中,当一个表格列数较多时,用户一个常见的需求就是把前面几个重要的列固定住,这样拖动滚动条时固定的列会方便用户查看数据,用户体验很好.一些重量级的JS组件库也都有这个功能,那么有没有更简单的方法实现这个功能呢? 这个需求常见的解决方案是使用表格拼接的方法,这个方案如果要制作静态的网页,或者功能简单的动态页面,逻辑比较简单,技术上也不复杂,很容易实现,但是如果要做成组件,动态功能较多的话,就需要写大量的冗余代码,难以维护,甚至于一个简单的功能,都需要些很多的代码,比如事件处理等,

添加和移除事件处理兼容各浏览器的封装(带详细注释)

//事件处理兼容各种浏览器,采用能力检测方法,所谓能力检测,就是有能力就做,没有能力就不做 //定义一个处理事件的对象,兼容各种浏览器,dom2级事件处理和ie事件,如果这两个事件都不兼容,就采用dom0级处理 var eventUtil ={ addEvent:function(element,type,handler){ if (element.addEventListener) { //非IE浏览器采用dom2级事件处理,type为事件类型如:click,handler为事件处理函数,fa

IE和FireFox中JS兼容之event

event对象 IE 中可以直接使用 event 对象,而 FF 中则不可以,解决方法之一如下:var theEvent = window.event || arguments.callee.caller.arguments[0]; 第二种是将 event 作为参数来传递:function xxx(e){var theEvent = window.event || e;} srcElement 和 target 在 IE 中 srcElement 表示产生事件的源,比如是哪个按钮触发的 oncl