forked from BigRoma/jquery-defaultText
-
Notifications
You must be signed in to change notification settings - Fork 1
/
jquery.defaultText.js
113 lines (102 loc) · 4.21 KB
/
jquery.defaultText.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
/*
* Default text - jQuery plugin for setting default text on inputs
*
* Author: Weixi Yen
*
* Email: [Firstname][Lastname]@gmail.com
*
* Copyright (c) 2010 Resopollution
*
* Licensed under the MIT license:
* http://www.opensource.org/licenses/mit-license.php
*
* Project home:
* http://www.github.com/weixiyen/jquery-defaultText
*
* Version: 0.1.0
*
* Features:
* Auto-clears default text on form submit, then resets default text after submission.
* Allows context definition for better performance (uses event delegation)
* Allow user to set events to auto-clear fields.
* - defaultText automatically resets after event is run. No need to manually re-populate default text.
*
* Usage (MUST READ):
*
* <input type="text" title="enter your username" /> // the title field is mandatory for this to work
*
* $.defaultText() // input will show "enter your username" by default
* // and have a css class of 'default'
* // form fields with default text automatically clear when submitting form
*
* $.defaultText({
* context:'form', // only inputs inside of 'form' will be set with defaultText
* css:'myclass', // class of input when default text is showing, default class is 'default'
* clearEvents:[
* {selector: '#button2', type:'click'}, // when button2 is clicked, inputs with default text will clear
* {selector: '#link3', type:'click'} // this is useful for clearing inputs on ajax calls
* ] // otherwise, you'll send default text to the server
* });
*
*/
(function($){
$.defaultText = function(opts) {
var selector = 'textarea[title], input:text[title]',
ctx = opts && opts.context ? opts.context : 'body',
css = opts && opts.css ? opts.css : 'default',
form_clear = [{selector: 'form', type:'submit'}];
clear_events = opts && opts.clearEvents ? form_clear.concat(opts.clearEvents) : form_clear;
$(ctx).delegate(selector, 'focusin', function(e){
e.stopPropagation();
onFocus($(this));
}).delegate(selector, 'focusout', function(e){
e.stopPropagation();
var ele = $(this),
title = ele.attr('title'),
val = ele.val();
if ($.trim(val) === '' || val === title) ele.val(title).addClass(css);
});
$(selector).trigger('focusout');
$.each(clear_events, function(i, event){
var type = event.type,
ele = $(event.selector),
len = ele.length;
if (ele.size()) {
var ev_queue = $.data( ele.get(0), "events" );
if (ev_queue) {
for (var x=0; x < len; x++) {
if($.data(ele.get(x), "events")[type] != undefined){
$.data( ele.get(x), "events" )[type].unshift({
type : type,
guid : null,
namespace : "",
data : undefined,
handler: function() {
blink();
}
});
}
}
} else {
ele.bind(type, function(){
blink();
});
}
}
});
function onFocus(ele) {
var title = ele.attr('title'),
val = ele.val();
ele.removeClass(css);
if (title === val) ele.val('');
}
function blink(){
$(selector).each(function(){
onFocus($(this));
});
setTimeout(function(){
$(selector).trigger('focusout');
}, 1);
}
}
})(jQuery);