【回忆1314】回忆之placeholder
直接看效果点这里
HTML
<!DOCTYPE html>
<html>
<head lang="zh-CN">
<meta charset="utf-8">
<title> Placeholder </title>
</head>
<body>
<input class="J_Placeholder" type="text" value=""/>
<textarea class="J_Placeholder"></textarea>
<script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script>
<script src="jquery.placeholder.js"></script>
<script>
$('.J_Placeholder').placeholder({
'txt': '请输入提示信息'
});
</script>
</body>
</html>
JS
/**
* @description: 表单input、textarea占位提示
* @author:jununx@gmail.com
* @update: 2014/11/10
*
* @param txt{string} 提示信息语句
*
* 用法
*
* $('.J_Placeholder').placeholder({
* 'txt': '请输入提示信息'
* });
*/ ;(function($){ var methods = {
init: function(opts){
this.isHtml5Placeholder() ? this.changeHtml5Placeholder(opts) : this.changePlaceholder(opts);
},
isHtml5Placeholder: function(){
var res = 'placeholder' in document.createElement('input');
return res;
},
changePlaceholder: function(opts){
opts.that.attr('value') == '' && opts.that.attr({
'value': opts.txt
}); opts.that
.on('focus', function(){
if($(this).val() === opts.txt){
$(this).attr('value', '');
}
})
.on('blur', function(){
if($(this).val() == ''){
$(this).attr({
'value': opts.txt
});
}
});
},
changeHtml5Placeholder: function(opts){
opts.that.attr({
'placeholder': opts.txt
});
}
}; $.fn.placeholder = function(opts){
opts = $.extend({
'that': this,
'txt': ''
}, opts || {});
methods.init(opts);
return this;
}; })(jQuery);
【回忆1314】回忆之placeholder的更多相关文章
- 【回忆1314】抽奖之Flash大转盘
1.搭建JS与Flash互通的环境 function thisMovie(movieName){ if (window.document[movieName]) { return window.doc ...
- 【回忆1314】第一次用AngularJS
1.创建指令的4种方式(ECMA) var appModule = angular.module('app', []); appModule.directive('hello', function() ...
- OI再见
以下是一只蒟蒻的回忆： 1.进入高一 小县城不重视OI，直到进了高中才知道有OI这个东西，于是我就开始了OI…（看，够弱的吧，相信你是小学就开始学了） 学了几天Pascal语法后，被老师报上了NOIP ...
- hope is a good thing!
好久没有写博客了,在这么特殊的日子里,似乎不写点东西感觉总是少了点什么.其实从昨天开始就在努力的回忆,回忆自己这个2014年都做了些什么?自己收获了些什么?突然就觉得去年的那个暑假是那么的熟悉,怎么又 ...
- NOIP2014 行记
不知道OI是啥或者信息学竞赛是啥的可以按`Ctrl+W`. <del>很早开始写的..准备出分之后再发布.</del> 谨以此文纪念我信息学竞赛的第一次正式考试. 背景音乐底部 ...
- 【java编程】ServiceLoader使用看这一篇就够了
转载:https://www.jianshu.com/p/7601ba434ff4 想必大家多多少少听过spi,具体的解释我就不多说了.但是它具体是怎么实现的呢?它的原理是什么呢?下面我就围绕这两个问 ...
- NOI2021 去不了记
没错,由于某些 zszz 的原因,我是真的去不了了(指去不了 ZJ) Day -11 ~ -7 - 2021.7.12 - 2021.7.16 令人自闭的 ISIJ 终于结束了----From ycx ...
- [源码解析] PyTorch 分布式 Autograd (4) ---- 如何切入引擎
[源码解析] PyTorch 分布式 Autograd (4) ---- 如何切入引擎 目录 [源码解析] PyTorch 分布式 Autograd (4) ---- 如何切入引擎 0x00 摘要 0 ...
- 回忆之placeholder
直接看效果点这里 HTML <!DOCTYPE html> <html> <head lang="zh-CN"> <meta charse ...
随机推荐
- Java订单号（时间加流水号）
import java.io.BufferedReader; import java.io.BufferedWriter; import java.io.File; import java.io.Fi ...
- Objective C内存管理之理解autorelease------面试题
Objective C内存管理之理解autorelease Autorelease实际上只是把对release的调用延迟了,对于每一个Autorelease,系统只是把该Object放入了当前的A ...
- The given object has a null identifier解决之法
<input type="hidden" name="memberPermission.id" value="${memb ...
- Android json操作之取得一个对象
1:服务端返回的json数据格式如下: {"id":"1001","name":"zhangsan","sco ...
- 自定义事件实现不同窗体间的通讯Delphi篇
要实现子窗体与父窗体之间的通讯,有多种方法(比如:重载子窗体的构造函数,将父窗体的引用作为参数传递给子窗体).下面我要介绍的是利用自定义事件的方法,它能够最大程度的避免模块之间的耦合,充分体现面向对象 ...
- SolrCloud 5.2.1 installation and configuration
虽然不是很有技术含量的事情,主要依靠的是阅读能力,然而知识的东西还是记录一下,以备后继待查. 环境相关 1. Server:h1,h2,h3 2. OS RHEL 6.2 3. Zookeeper 3 ...
- 在ubuntu上编译chrome
在ubuntu上编译chrome 在ubuntu上编译chrome 红心地瓜 1.获取代码 1)下载tarball,http://chromium-browser-source.commondatas ...
- c语言内存模型
文章一.C语言的内存分配模型 1.程序代码区:存放函数体的二进制代码. 2.全局区数据区:全局数据区划分为三个区域.全局变量和静态变量的存储是放在一块的,初始化的全局变量和静态变量在一块区域,未初始化 ...
- poj3237 Tree
Description You are given a tree with N nodes. The tree’s nodes are numbered 1 through N and its edg ...
- CentOS下MySQL无法正常启动错误
一.非正常关机/退出MySQL时报错:/var/lib/mysql/mysql.sock 1.重启机器:shutdown -h now 2.删除或重命名:rm -r /var/lib/mysql/my ...