鼠标点击输入框文字消失 value实现方法  placeholder实现方法     以及JQ实现placeholder效果

<input type="text" value="请输入手机号" id="demo" class="inp-fon">
<input type="text" value="请输入银行卡号" id="demo" class="inp-fon">
<input type="text" value="请输入" id="demo" class="inp-fon">
<input name="textfield"type="text"value="点击添入标题"onfocus="if (value =='点击添入标题'){value =''}"onblur="if (value ==''){value='点击添入标题'}"/>
<input type="text" onfocus="this.placeholder = ''" onblur=" this.placeholder='' " placeholder="输入手机号/账户号" />
<textarea name="textarea"cols="80"rows="17"onfocus="if(value=='正文:'){value=''}"onblur="if (value ==''){value='正文:'}"></textarea>
<script>
$("input").focusin(function(){
var oldValue = $(this).val();
if(oldValue == this.defaultValue){
$(this).val("");
}
}).blur(function(){

var oldValue = $(this).val();
if(oldValue == ""){
$(this).val(this.defaultValue);
}
});
</script>

鼠标点击输入框文字消失 value placeholder 以及JQ实现效果 (仿京东的输入框效果)的更多相关文章

  1. JavaScript001,鼠标点击改变文字或图片

    <h3>我的第一个Javascript</h3> <p id="demo1">1.点击按钮,改变内容!</p> <!-- 设置 ...

  2. 鼠标点击自定义文字展现特效JS代码

    JS特效使用方法 只需将如下JS代码放到</body>之前就好了 var a_idx = 0; jQuery(document).ready(function($) { $("b ...

  3. Js制作点击输入框时默认文字消失的效果

    (从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期 2014-02-17) 为了提高用户体验和易用度,一些设计师会对网页中用户经常用的东西进行优化,比如输入框.一般的输入框是怎样优化的呢 ...

  4. 小问题总结:鼠标点击到输入框(input)里的时候,输入框的提示消失,鼠标再移开,输入框提示出现

    问题如标题: 鼠标点击到输入框(input)里的时候,输入框的提示消失,鼠标再移开,输入框提示出现.如图所示:   做法如下: <input type="text" name ...

  5. 输入框获取焦点后placeholder文字消失、修改placeholder的样式

    输入框获取焦点后placeholder文字消失: <input placeholder='' onfocus="this.placeholder=''" onblur=&qu ...

  6. jQuery, 文本框获得焦点后, placeholder提示文字消失

    文本框获得焦点后, 提示文字消失, 基于jQuery, 兼容性: html5 //所有文本框获得焦点后, 提示文字消失 $('body').on('focus', 'input[placeholder ...

  7. html5文本框提示文字属性为placeholder

    html5文本框提示文字属性为placeholder 例子:  <textarea id="comment" class="commentCont"  n ...

  8. JS控制鼠标点击事件

    鼠标点击事件就是当鼠标点击元素时,就会出现另一个窗口,类似于百度首页中右上角的“登录”这个按钮,当鼠标点击 登录时,就会出现登录窗口.大体的意思就是这样,直接上代码了,简单易懂. <!DOCTY ...

  9. 鼠标点击 input,显示瞬间的边框颜色,对之修改与隐藏

    示例的是项目中的遇到的,要做成的效果是点击该图片按钮,达到切换图片的效果: HTML代码如下: <input class="dBox3Ulimg" type="im ...

随机推荐

  1. robots

    User-agent: Baiduspider Disallow: /w? Allow: / User-agent: Googlebot Allow: / User-agent: Googlebot- ...

  2. Android onMeasure方法介绍

    onMeasure方法在控件的父元素正要放置它的子控件时调用.它会问一个问题,“你想要用多大地方啊?”,然后传入两个参数——widthMeasureSpec和heightMeasureSpec. 它们 ...

  3. rabbitmq redis

    RabbitMQ RabbitMQ是一个在AMQP基础上完整的,可复用的企业消息系统. 对于RabbitMQ来说,生产和消费不再针对内存里的一个Queue对象,而是某台服务器上的RabbitMQ Se ...

  4. 导入charts开源库到工程里面

    http://blog.csdn.net/zww1984774346/article/details/50608338 http://blog.csdn.net/zww1984774346/artic ...

  5. LUA表克隆方法归纳

    lua表克隆 将lua一个表, 克隆出一份为一个独立的另外一个表. 对于一个module, 如果在require之后,获得的表对象, 不能直接修改, 例如lua缓存此表, 但是多次逻辑执行, 都使用的 ...

  6. java的客户端可以连接CPlus的服务端

    今天做的实验,用c++做的服务端,端口号为6000:用java做的客户端,IP为127.0.0.1,port为6000,结果双方可以连接上线: 贴代码: 服务端: #include <winso ...

  7. QQ 图片

    http://wpa.qq.com/pa?p=2:QQ号码:45 查看QQ是否在线,或者图片,在这里,其他的另行百度. <!-- tencent://message/?uin=763999883 ...

  8. 关于在archlinux中安装virtualbox

    之前安装的时候具体忘记了,现在重新整理一下安装的过程: 1. 安装virtualbox sudo pacman -S virtualbox 安装的过程中因依赖,需要安装提供host模块的包,这里我们安 ...

  9. ECMAScript 6教程 (一)

    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出 原文连接,博客地址为 http://www.cnblogs.com/jasonnode/ .该系列课程是 ...

  10. 十、Java基础---------面向对象之抽象类与接口

    抽象类(abstract)     当编写一个类时,时常会为该类定义一些方法,这些方法的使用用以描述该类的行为方式,那么这些方法都有具体的方法体.但是在某些情况下,某个父类只是知道子类应该包含怎样的方 ...