input placeholder属性IE、360浏览器兼容性问题

效果:http://hovertree.com/texiao/jquery/43/效果二:http://hovertree.com/texiao/jquery/43/1/请在IE中体验。1、创建

大家好,又见面了,我是全栈君,今天给大家准备了Idea注册码。

input placeholder属性IE、360浏览器兼容性问题此处内容已经被作者隐藏,请输入验证码查看内容
验证码:
请关注本站微信公众号,回复“”,获取验证码。在微信里搜索“”或者“”或者微信扫描右侧二维码都可以关注本站微信公众号。

效果:http://hovertree.com/texiao/jquery/43/

效果二:http://hovertree.com/texiao/jquery/43/1/

请在IE中体验。

 

1、创建JS文件:jquery.JPlaceholder.js

js代码如下:

/*
 * jQuery placeholder, fix for IE6,7,8,9
* hovertree.com
 */
var JPlaceHolder = {
    //检测
    _check : function(){
        return 'placeholder' in document.createElement('input');
    },
    //初始化
    init : function(){
        if(!this._check()){
            this.fix();
        }
    },
    //修复 何问起
    fix : function(){
        jQuery(':input[placeholder]').each(function(index, element) {
            var self = $(this), txt = self.attr('placeholder');
            self.wrap($('<div></div>').css({position:'relative', zoom:'1', border:'none', background:'none', padding:'none', margin:'none'}));
            var pos = self.position(), h = self.outerHeight(true), paddingleft = self.css('padding-left');
            var holder = $('<span></span>').text(txt).css({position:'absolute', left:pos.left, top:pos.top, height:h, lienHeight:h, paddingLeft:paddingleft, color:'#aaa'}).appendTo(self.parent());
            self.focusin(function(e) {
                holder.hide();
            }).focusout(function(e) {
                if(!self.val()){
                    holder.show();
                }
            });
            holder.click(function(e) {
                holder.hide();
                self.focus();
            });
        });
    }
};
//执行 
jQuery(function(){
    JPlaceHolder.init();    
});

2、页面中使用方法如下:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery JPlaceholder Demo - 何问起</title>
<script src="http://hovertree.com/ziyuan/jquery/jquery-1.8.3.min.js"></script>
<script src="http://hovertree.com/texiao/jquery/43/jquery.JPlaceholder.js"></script>
</head>
 
<body>
<form>
<div>
  <ul>
    <li>
      <input type="text" name="username" placeholder="用户名">
    </li>
    <li>
      <input type="password" name="username" placeholder="密码">
    </li>
    <li>
      <button type="button">登录</button>
    </li>
  </ul>
</div>
</form>
<a href="http://hovertree.com/h/bjaf/ww7ek8wn.htm">参考</a>
</body>
</html>
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/120632.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)
blank

相关推荐

  • vim常用配置_如何配置电脑

    vim常用配置_如何配置电脑1.首先需要安装一个ctag:apt-getinstallexuberant-ctags2.安装taglist:http://vim.sourceforge.net/scripts/download_script.php?src_id=6416复制到ubuntu中,使用命令解压:unziptaglist_42.zip3.解压后出现两个文件夹,doc和…

  • C语言银行家算法

    C语言银行家算法算法简介银行家算法(Banker’sAlgorithm)是一个避免死锁(Deadlock)的著名算法,是由艾兹格·迪杰斯特拉在1965年为T.H.E系统设计的一种避免死锁产生的算法。它以银行借贷系统的分配策略为基础,判断并保证系统的安全运行。算法目的为了了解系统的资源分配情况,假定系统的任何一种资源在任意时刻只能被一个进程使用,任何进程已经占用的资源只能由进程自己释放,而不能由其他进…

  • 如何自建一个git服务器,搭建Git服务器,真的很简单

    如何自建一个git服务器,搭建Git服务器,真的很简单重要提醒,本教材适用于gitolitev2,与当前最新版v3不兼容!!需要在checkoutgitolite后,切换到v2版!!其实真的只需要几句#现在开始是root做的#安装Gitapt-getinstallgit#拷贝你自己的公钥cp~/.ssh/id_rsa.pub/tmp/wendal.pubgitclonegit://github.com/sitaramc/gitoli…

  • 【愚公系列】2022年02月 wireshark系列-数据抓包分析之DHCP协议

    【愚公系列】2022年02月 wireshark系列-数据抓包分析之DHCP协议实验步骤一获取DHCP数据包在windows平台上获取DHCP数据包在windows平台上,可以使用两种简单的方法实现,其原理一样。(1)在cmd上,使用ipconfig命令来获取。执行完上述命令后,将释放当前使用的地址信息。重新获取地址信息,执行命令如下执行完上面的命令后,将重新获取地址信息。在获取地址时,将会经过上面讲述的DHCP的4个阶段。这样,我们就能获取到DHCP数据包了。(2)通过禁用和启用网卡获取DHCP数据包在windows平台上,也可以通过禁用和启用网卡获取DHCP数

  • Hsql函数上

    Hsql函数上Hsql函数.上(关系/数学/逻辑/数值/日期/条件/字符串/集合统计/复杂类型)原文链接:https://blog.csdn.net/scgaliguodong123_/article/details/60881166hive常见函数准备数据zhangsa dfsadsa323 new 67.1 2lisi 543gfd old 43.32 1wanger 65ghf new…

  • 感谢 Gridea,让我有动力写作

    感谢 Gridea,让我有动力写作1.真的要感谢Gridea,让我对写作产生热忱。一直有在各大博客平台输出的习惯,但是都没有持续更新。有的平台广告太多,写不下去。有的平台排版复杂,写文章1个小时,排版要2个小时。所以后面换成了静态

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号