Skip to content

Commit

Permalink
Updated readme to show the plugin works with textareas as well. Clear…
Browse files Browse the repository at this point in the history
… textarea values upon page reload
  • Loading branch information
mathiasbynens committed Jul 3, 2010
1 parent 933d050 commit 22b94f3
Show file tree
Hide file tree
Showing 3 changed files with 14 additions and 13 deletions.
15 changes: 8 additions & 7 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,21 +10,22 @@ This plugin was based on a code snippet by [Paul Irish](http://paulirish.com/),

### HTML

<input type="text" name="foo" placeholder="Enter some text here">
<input type="email" name="bar" placeholder="Enter your email address">
<input type="search" name="baz" placeholder="Search this site…">
<input type="url" name="wtf" placeholder="Enter your URL">
<input type="tel" name="omg" placeholder="Enter your phone number">
<input type="text" name="name" placeholder="e.g. John Doe">
<input type="email" name="email" placeholder="e.g. [email protected]">
<input type="url" name="url" placeholder="e.g. http://mathiasbynens.be/">
<input type="tel" name="tel" placeholder="e.g. +32 472 77 69 88">
<input type="search" name="search" placeholder="Search this site…">
<textarea name="message" placeholder="Your message goes here"></textarea>

### jQuery

$('input').placeholder();
$('input, textarea').placeholder();

### CSS

The plugin automatically adds `class="placeholder"` to the elements who are currently showing their placeholder text. You can use this to style placeholder text differently:

input { color: #000; }
input, textarea { color: #000; }
.placeholder { color: #aaa; }

## Notes
Expand Down
8 changes: 4 additions & 4 deletions jquery.placeholder.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
/*!
* HTML5 Placeholder jQuery Plugin v1.1
* HTML5 Placeholder jQuery Plugin v1.2
* @link http://github.com/mathiasbynens/Placeholder-jQuery-Plugin
* @author Mathias Bynens <http://mathiasbynens.be/>
*/
Expand All @@ -20,8 +20,8 @@
$elem.removeClass('placeholder');
};
};
// This selector could be shortened to form:has([placeholder]) but that would be less efficient
$('form:has(input[placeholder])').submit(function() {
// Look for forms with inputs and/or textareas with a placeholder attribute in them
$('form:has([placeholder])').submit(function() {
// Clear the placeholder values so they don’t get submitted
$('.placeholder', this).val('');
});
Expand All @@ -32,7 +32,7 @@
// Yes, .each() — in case .placeholder() is called on several elements, which is very likely, e.g. $('input').placeholder();
return this.each(function() {
var $input = $(this);
// Quit if the current element is a password input, or not an input at all
// Quit if the current element is a password input, or not an input/textarea at all
if ($input.is(':password') || !$input.is(':input')) {
return;
};
Expand Down
4 changes: 2 additions & 2 deletions jquery.placeholder.min.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

0 comments on commit 22b94f3

Please sign in to comment.