【placeholder 效果的实现，input提示字，获取焦点时消失】的更多相关文章

placeholder 效果的实现，input提示字，获取焦点时消失

<!doctype html><html><head><meta charset="utf-8"><title>placeholder 效果的实现</title><script src="http://code.jquery.com/jquery-1.10.1.min.js"></script></head><style>body {       …

input提示字在有焦点消失或输入改变时消失

一:获取焦点时 提示字消失 <input type="text" name="textfield" value="这里是提示内容" onclick="if(value==defaultValue){value='';this.style.color='#000'}" onBlur="if(!value){value=defaultValue;this.style.color='#999'}" />…

IOS 固定定位底部input输入框，获取焦点时弹出的输入法键盘挡住input

移动页面经常会做到这样一个效果,看下面的图片,重点就是那个固定定位的底部,里面有个input输入框,在输入字符的时候,安卓手机看着是完全没有问题! 1.页面没有点击底部input的初始状态 2.安卓手机下的样子,一切都是那么的正常,简直是完美. 3.ios手机下,就是这么任性,没有办法,完全挡着了,挡着了,挡着了...,必须把整个页面滑到最底下才能看见它,捉迷藏啊简直是. 不怕丢人的说,此问题遇见一年多了终于得到完美解决,更加精彩.更加狗血的是代码只有特么的一行! 请睁大眼睛看 <script…

a、button、input点击获取焦点时出现蓝色边框，如何去掉

a,button,input{ -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-user-modify: read-write-plaintext-only; } 可根据实际情况添加 outline: none; 或 box-shadow: none; 有时候<img />图片放在a标签里也会出现边框,可设置图片的边框为0. 除此之外还要注意其伪类的设置. js方法: onclick="this.blur()"…

HTML5轻松实现搜索框提示文字点击消失---及placeholder颜色的设置

在做搜索框的时候无意间发现html5的input里有个placeholder属性能轻松实现提示文字点击消失功能,之前还傻傻的在用js来实现类似功能... 示例 <form action="demo_form.asp" method="get"> <input type="search" name="user_search" placeholder="我是提示文字 在此输入文本我会消失" /…

HTML 5 <input> placeholder 属性 实现搜索框提示文字点击输入后消失

H5之前要实现这个功能还要用到JS,H5出来之后新增加了placeholder属性,有了这个属性就就能轻松实现这个功能. 定义和用法 placeholder 属性提供可描述输入字段预期值的提示信息(hint). 该提示会在输入字段为空时显示,并会在字段获得焦点时消失. 注释:placeholder 属性适用于以下的 <input> 类型:text, search, url, telephone, email 以及 password.(此处来自W3cSchool) <form name=&…

浅谈实现placeholder效果的几种方案

placeholder是html5<input>的一个属性,它提供可描述输入字段预期值的提示信息(hint), 该提示会在输入字段为空时显示.高端浏览器支持此属性(ie10/11在获得焦点时文字消失),ie6/7/8/9则不支持.为了兼容各主流浏览器并使其呈现效果保持一致,以下三套方案仅供参考. 方案一: 摒弃原始属性placeholder,为input添加一个兄弟节点span,并为span设置绝对定位(父节点为position: relative;),使其位于input之上. html代码片…

编辑框添加灰色提示字（html+VC）

Html中添加灰色提示字,使用属性placeholder即可! <input type="text" placeholder="要显示的文字"> 但是,VC++实现这样的效果比较困难,但是可以借助ToolTipCtrl实现类似的效果: 1.对话框头文件中声明成员变量:CToolTipCtrl   m_ToolTip; 2.对话框OnInitDialog中加入: m_ToolTip.Create(this); m_ToolTip.AddTool(GetDl…

【jquery】基于 jquery 实现 ie 浏览器兼容 placeholder 效果

placeholder 是 html5 新增加的属性,主要提供一种提示(hint),用于描述输入域所期待的值.该提示会在输入字段为空时显示,并会在字段获得焦点时消失.placeholder 属性适用于以下类型的 input 标签:text, search, url, telephone, email 以及 password. 我们先看下在谷歌浏览器中的效果,如图所示: 获得焦点时: 输入字段: 因为是 html5 属性,自然低版本的浏览器比如 ie6-8 不兼容.下面就介绍下如何在低版本浏览器中…

在IE8等不支持placeholder属性的浏览器中模拟placeholder效果

placeholder是一个很有用的属性,可以提示用户在input框中输入正确的内容,但是IE8以及IE8一下的浏览器不支持该属性,我们可以使用js来模拟相似的效果.下面直接上代码: <!doctype html> <html> <header> <meta charset="utf-8"> <title>placeholder</title> <style type="text/css"…