ie9 的input框没有placeholder属性 啧啧啧~~~

所以就用span标签来模拟一下

先判断浏览器类型

if(navigator.useAgent.indexOf("MSIE 9.0")>0){
啦啦啦,现在用的是ie9浏览器
我想我家东东了~~~
}

封装函数

function ifie9(){
//判断是否是ie9
if(navigator.userAgent.indexOf("MSIE 9.0")>0){
//input元素
$(".ipt").each(function(){
var self = $(this);
self.parent().append('<span class="placeholder" data-type = "placeholder">我爱东东</span>')
if(self.val() != ''){
self.parent().find("span.placeholder").hide()
}else{
self.parent().find("span.placeholder").show()
}
}).on('foucs',function(){
$(this).parent().find("span.placeholder").hide()
}).on('blur',function(){
var self = $(this);
if(self.val != ''){
self.parent().find("span.placeholder").hide()
}else{
self.parent().find("span.placeholder").show()
}
});
$("span.placeholder").on('clock',function(){
$(this).hide()
})
}
}
function ifie9(){
    //判断是否是ie9
    if(navigator.userAgent.indexOf("MSIE 9.0")>){
        //input元素
        $(".ipt").each(function(){
            var self = $(this);
            self.parent().append('<span class="placeholder" data-type = "placeholder"></span>')
            if(self.val() != ''){
                self.parent().find("span.placeholder").hide()
            }else{
                self.parent().find("span.placeholder").show()
            }
        }).on('foucs',function(){
            $(this).parent().find("span.placeholder").hide()
        }).on('blur',function(){
            var self = $(this);
            if(self.val != ''){
                self.parent().find("span.placeholder").hide()
            }else{
                self.parent().find("span.placeholder").show()
            }
        });
        $("span.placeholder").on('clock',function(){
            $(this).hide()
        })
    }
}

模拟ie9的placeholder的更多相关文章

  1. 用UITextView模拟UITextField的placeHolder

    用UITextView模拟UITextField的placeHolder 效果: 源码: // // ViewController.m // TextView // // Created by You ...

  2. IE9以下 placeholder兼容

    //input placeholder兼容!(function ($, doc, win) { $.fn.placeholder = function () { var i = doc.createE ...

  3. UITextView模拟UITextField 设置Placeholder属性 --董鑫

    由于最近有用到输入框,刚开始考虑的是UITextField,因为它在没有输入的时候可以有提示的Placeholder更能,很人性化,但UITextField只能单行输入,不能跳行,对于一些强迫症的亲来 ...

  4. 让div支持placeholder属性/模拟输入框的placeholder属性

    实现方式:css div:empty:before{ content: attr(placeholder); color:#bbb;}div:focus:before{ content:none; }

  5. 让IE8和IE9支持 placeholder

    1.原因:placeholder是h5的新属性,IE10以前的浏览器(8.9)不支持此属性. 2.解决方法:jQuery三方插件  jquery-placeholder 3.快速开始: <!DO ...

  6. HTML5 placeholder实际应用经验分享及拓展

    QQ邮箱登陆(http://mail.qq.com) 如下截图啦: 我在上面一个demo类似原理上做了下修改,制作了一个这样子交互效果的demo,希望对有兴趣的同行能帮上点忙,您可以狠狠地点击这里:透 ...

  7. 关于IE9 table显示错位的问题

    首先,win10无法安装IE9,所以需要用IE11模拟IE9,这样:http://www.w10zj.com/Win10xy/Win10yh_638.html: 其次,table显示错位的可能原因:h ...

  8. React+Webpack+ES6 兼容低版本浏览器(IE9)解决方案

    虽然过了兼容IE6的噩梦时代,IE依旧阴魂不散,因为你可能还要兼容IE9.在ES6已经普及的今天,用ES6写react已经成了标配.但是babel编译的js语法,由于某些不规范的写法,可能在IE9下不 ...

  9. 项目问题整理(it)

    1,很(屎)优(一)雅(样)的IE9兼容问题: --webuploader在webkit浏览器中自动使用h5上传,但在IE中需要配置支持flash,特别注意两点: ①Upload.swf路径问题不正确 ...

随机推荐

  1. AndroidStudio3.0的安装和配置笔记

    开发Android项目要搭建开发环境.可以选择使用Eclipse安装ADT插件来开发安卓项目,也可以使用谷歌的官方IDE——AndroidStudio3.0. AndroidStudio3.0安装的具 ...

  2. 搭建Activemq集群

    首先搭建zookeeper集群: 参考URL:  http://www.cnblogs.com/feiyun126/p/7244394.html 三台服务器:先设置hosts 10.0.0.231 n ...

  3. POJ 1861 ——Network——————【最小瓶颈生成树】

    Network Time Limit: 1000MS   Memory Limit: 30000K Total Submissions: 15268   Accepted: 5987   Specia ...

  4. Hibernate课程 初探多对多映射2-2 创建持久化类和映射文件

    生成实体类 和 cfg.xml配置 cfg.xml 参照一对多映射 实体类如下: Project 类 package com.ddwei.entity; import java.util.HashSe ...

  5. Django Rest Framework进阶二

    一.版本 版本控制:当程序越来越大,后期需要再加入一些功能或者进行二次开发时就需要加上版本号了. 之前我们在没有接触rest_framework之前一般是以下这种方式来实现的 class UserVi ...

  6. ATL

    Normal COM.cpp #include "resource.h" // 主符号 #include "ATLCOM_i.h" #include " ...

  7. python模块详解 XML

    XML模块 XML是实现不同语言或程序之间进行数据交换的协议,和json一样. XML格式: <?xml version="1.0" encoding="UTF-8 ...

  8. JavaScript基础:逻辑运算符——&&和||(短路判断)和!

    一.&&:所有条件都为true,返回true:只要有一个是false,返回false:不一定返回boolean类型值 1.可以操作任意类型的数据,不只是布尔型:(除了null.unde ...

  9. 微软提供的 Web 版 Raspberry Pi 模拟器

    https://docs.microsoft.com/en-gb/azure/iot-hub/iot-hub-raspberry-pi-web-simulator-get-started#overvi ...

  10. 缓存的set、getAndTouch一定要谨慎使用

    缓存的set.getAndTouch一定要谨慎使用. 很多人认为缓存在内存中性能良好,频繁更新,却不想机器的IO无法支撑,结果就是缓存成了系统的瓶颈.