文档章节

web前端技术--Placeholder

H
 H_J
发布于 2014/09/02 22:51
字数 170
阅读 10
收藏 0

1.

var funPlaceholder = function(element) {
     var placeholder = '';
     if (element && !("placeholder" in document.createElement("input"))
       && (placeholder = element.getAttribute("placeholder"))) {
      element.onfocus = function() {
           if (this.value === placeholder) {
            this.value = "";
           }
       this.style.color = '#000';
      };
      element.onblur = function() {
       if (this.value === "") {
        this.value = placeholder;
        this.style.color = '#999';
   } else {
    this.style.color = '#000';
   }
  };

  // 样式初始化
  if (element.value === "") {
   element.value = placeholder;
   element.style.color = '#999';
  }
 }
};

2.

 var  IePlaceholder=function(){
        var doc = window.document, input = doc.createElement('input');
        if( typeof input['placeholder'] == 'undefined' ) // 如果不支持placeholder属性
        {
            $('input').each(function( ele )
            {
                var me = $(this);
                var ph = me.attr('placeholder');
                if( ph && !me.val() )
                {
                    me.val(ph).css('color', '#aaa').css('line-height', me.css('height'));
                }
                me.on('focus', function()
                {
                    if( me.val() === ph)
                    {
                        me.val(null).css('color', '');
                    }
                }).on('blur', function()
                        {
                            if( !me.val() )
                            {
                                me.val(ph).css('color', '#aaa').css('line-height', me.css('height'));
                            }
                        });
            });
        }
    }

© 著作权归作者所有

H

H_J

粉丝 20
博文 19
码字总数 27342
作品 0
成都
私信 提问
前端每周清单第 37 期:Bootstrap 4 必知必会、2017 Vue.js 报告、Graphcool 开源框架

前端每周清单专注前端领域内容,以对外文资料的搜集为主,帮助开发者了解一周前端热点;分为新闻热点、开发教程、工程实践、深度阅读、开源项目、巅峰人生等栏目。欢迎关注【前端之巅】微信公...

王下邀月熊
2017/10/31
0
0
利用Webpack插件进行前端code-splitting

摘要:今天我介绍一个 webpack loader - grow-loader。 之前在 LINE 漫画:通过 Page Stack 实现流畅的页面切换这篇文章中介绍过,LINE 应用内部的漫画 APP 使用的是 web 技术。为了提供接近...

前端之巅
2017/12/29
0
0
Placeholder in IE8 and older

在前端开发中,Input需要有提示信息,在Chrome等浏览器中可以方便的使用placeholder属性,但是在IE8 or older浏览器中会出现无法显示的问题,如果开发自己去写一个function来进行提示信息的显...

Geek-S
2016/06/08
32
0
Web 开发中 9 个有用的提示和技巧

在本文中,我们给出 9 个有用的 HTML、CSS 和 JavaScript 的技巧和提示,可能在做 Web 开发中经常会需要用到的,其中有几个是关于 HTML5 和 CSS3 的,如果你是一个前端开发者,那么或许对你有...

彭博
2012/11/27
305
0
Web 开发中 9 个有用的提示和技巧

在本文中,我们给出 9 个有用的 HTML、CSS 和 JavaScript 的技巧和提示,可能在做 Web 开发中经常会需要用到的,其中有几个是关于 HTML5 和 CSS3 的,如果你是一个前端开发者,那么或许对你有...

小编辑
2012/06/05
5.5K
17

没有更多内容

加载失败,请刷新页面

加载更多

电子字典C语言链表版

#define _CRT_SECURE_NO_WARNINGS#include <stdio.h>#include <stdlib.h>#include <string.h>#include <time.h>struct dict{ char *key; char *content; struct dict *ne......

holdbody
35分钟前
4
0
windows 查看 端口使用情况

资料 https://jingyan.baidu.com/article/3c48dd34491d47e10be358b8.html 统计端口连接数 netstat -an|find "8080" /c...

zaolonglei
36分钟前
3
0
OSG 屏幕空间环境光遮蔽(SSAO)讲义3 算法的核心

先介绍SSAO 接着介绍SSAO的核心算法 延迟着色法的采样 颜色采样 把像机的几个参数传入Shader SSAO渲染 建立SSAO摄像机 SSAO摄像机显示漫反射采样 先用上下像素点的方案, 再次讲原理. 换用RGB...

洛克人杰洛
56分钟前
2
0
聊聊rocketmq的AccessChannel

序 本文主要研究一下rocketmq的AccessChannel AccessChannel rocketmq-client-4.5.2-sources.jar!/org/apache/rocketmq/client/AccessChannel.java public enum AccessChannel { /** ......

go4it
昨天
9
0
自己实现 aop 和 spring aop

上文 说到,我们可以在 BeanPostProcessor 中对 bean 的初始化前化做手脚,当时也说了,我完全可以生成一个代理类丢回去。 代理类肯定要为用户做一些事情,不可能像学设计模式的时候创建个代...

sanri1993
昨天
5
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部