js实现placeholder效果
- <form name="testForm" action="" method="">
- <input type="text" name="hotGoods" class="text1">
- </form>
- <script type="text/javascript">
- $(document).ready(function() {
- $("input.text1").val('请输入您要搜索的内容').css('color','#ccc');
- textFill($('input.text1'));
- });
- function textFill(input){
- var originalvalue = input.val(); //请输入您要搜索的内容
- // console.log(originalvalue);
- input.focus( function(){
- if( $.trim(input.val()) == originalvalue ){
- input.css('color', '#333');
- input.val('');
- }
- });
- input.blur( function(){
- if( $.trim(input.val()) == '' ){
- input.css('color', '#ccc');
- input.val(originalvalue);
- }
- });
- }
- </script>
js实现placeholder效果的更多相关文章
- React.js实现原生js拖拽效果及思考
一.起因&思路 不知不觉,已经好几天没写博客了...近来除了研究React,还做了公司官网... 一直想写一个原生js拖拽效果,又加上近来学react学得比较嗨.所以就用react来实现这个拖 ...
- 【jquery】基于 jquery 实现 ie 浏览器兼容 placeholder 效果
placeholder 是 html5 新增加的属性,主要提供一种提示(hint),用于描述输入域所期待的值.该提示会在输入字段为空时显示,并会在字段获得焦点时消失.placeholder 属性适用于 ...
- 浅谈实现placeholder效果的几种方案
placeholder是html5<input>的一个属性,它提供可描述输入字段预期值的提示信息(hint), 该提示会在输入字段为空时显示.高端浏览器支持此属性(ie10/11在获得焦点 ...
- IE下支持文本框和密码框placeholder效果的JQuery插件
基于jQuery实现的,主要用于IE下实现placeholder效果,可同时支持文本和密码输入框.placeholder是HTML5新增的一个属性,当input设置了该属性后,该值的内容将作为灰色提示 ...
- Jquery简单的placeholder效果
Jquery简单的placeholder效果 由于IE6-IE9不支持HTML5中的placeholder,所以自己依赖于Jquery简单的写了一个,供参考! 先看看效果吧!如下JSFiddle地址 ...
- JS添加标签效果
JS添加标签效果 在豆瓣网上添加自己的标签是一种常见的效果,今天也就做了一个简单的demo.由于时间的问题 我不多原理,大家可以试着操作几遍就能明白其中的原理了. JSFiddle的效果如下: 点击我 ...
- jQuery实现ie浏览器兼容placeholder效果
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 跨浏览器实现placeholder效果的jQuery插件
曾经遇到这样一个问题,处理IE8密码框placeholder属性兼容性.几经周折,这个方案是可以解决问题的. 1.jsp页面引入js插件 <script type="text/java ...
- placeholder 效果的实现,input提示字,获取焦点时消失
<!doctype html><html><head><meta charset="utf-8"><title>plac ...
随机推荐
- leetcode实现 “10001”+“1011” 返回二进制相加的结果
https://oj.leetcode.com/problems/add-binary/ 实” 1 public class Solution { public String addBinary(St ...
- JavaScript高级程序设计1.pdf
第一遍通读的时候对JavaScript一点都不了解翻了一整本书仅仅是眼熟的几个名词,现在会写一些js效果了,对程序有一定的认知,又要在读一遍,再加深一些了解,当然以后还会有第三遍第四遍,等完全啃透了这 ...
- asp 数组
定义简单数组 有两种方法在asp中定义和初始化数组,让我们看看每种的例子: 方法一:MyArray = Array("Jan","Feb","Mar& ...
- Redis教程03——Redis 发布/订阅(Pub/Sub)
Pub/Sub 订阅,取消订阅和发布实现了发布/订阅消息范式(引自wikipedia),发送者(发布者)不是计划发送消息给特定的接收者(订阅者).而是发布的消息分到不同的频道,不需要知道什么样的订阅者 ...
- zendstudio xdebug 配置
1. 下载XDebug: http://www.xdebug.org/download.php 通过phpinfo()查看你的php版本,现在相对应的dll文件
- Git命令详解(一)-个人使用
本文暂时不会涉及到团队如何使用Git的内容,而是从个人的角度探讨如何用好Git. 约定 绿色的5位字符表示提交的ID,文中用<commit>表示,分别指向父节点.分支用橘色显示,分别指向特 ...
- 3proxy 二级代理配置样例
适应情况: 有时,我们的机器HOST-A只能通过代理服务器HOST-B才可以访问internet, 而与我们相连的机器HOST-C也需要访问internet, 但是HOST-C却不能直接访问HOST- ...
- php开发工具zendstudio13破解补丁
io? Intelligent Code Editor Robust Debugging Capabilities Eclipse Ecosystem Mobile: AngularJS, Ioni ...
- VMware-workstation-full-12.0.1-3160714
https://download3.vmware.com/software/wkst/file/VMware-workstation-full-12.0.1-3160714.exe 5A02H-AU2 ...
- BFS-hdu-4101-Ali and Baba
题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=4101 题目大意: 给一个矩阵,0表示空的可走,-1宝藏的位置(只有一个),其余的正整数表示该位置石头 ...