Comments on: Simple jQuery placeholder script for input fields http://www.iliadraznin.com/2010/03/simple-jquery-placeholder-script-input-fields/ Web Developer, Designer and Enthusiast Wed, 25 Jan 2012 17:01:02 +0000 hourly 1 http://wordpress.org/?v=3.3.1 By: Marc Görtz http://www.iliadraznin.com/2010/03/simple-jquery-placeholder-script-input-fields/#comment-442 Marc Görtz Mon, 08 Nov 2010 12:56:03 +0000 http://iliadraznin.com/?p=166#comment-442 You may want to take a look at my Placeholder Placebo jQuery script at Github: https://gist.github.com/373672 It tests for native placeholder support and extends jQuery’s $.support method. It also checks if the input element is focused while the page gets reloaded or an Ajax request is performed. You may want to take a look at my Placeholder Placebo jQuery script at Github: https://gist.github.com/373672

It tests for native placeholder support and extends jQuery’s $.support method. It also checks if the input element is focused while the page gets reloaded or an Ajax request is performed.

]]> By: Designing Search Boxes with HTML5 and CSS3 - Azadcreative.com http://www.iliadraznin.com/2010/03/simple-jquery-placeholder-script-input-fields/#comment-440 Designing Search Boxes with HTML5 and CSS3 - Azadcreative.com Fri, 05 Nov 2010 16:15:46 +0000 http://iliadraznin.com/?p=166#comment-440 [...] Mark Pilgrim’s Dive into HTML5 covers every base in complete detail. [↩]Thanks to Ilia Draznin [...] […] Mark Pilgrim’s Dive into HTML5 covers every base in complete detail. [↩]Thanks to Ilia Draznin […]

]]> By: gren http://www.iliadraznin.com/2010/03/simple-jquery-placeholder-script-input-fields/#comment-318 gren Thu, 22 Apr 2010 08:54:07 +0000 http://iliadraznin.com/?p=166#comment-318 Thanks for the script, really useful. the test if ($.browser.webkit) return false; doesn't work (and $.browser is deprecated). So, I propose another test : if('placeholder' in document.createElement('input')) return false; It works -on Firefox (placeholder not implemented by ff3.6 and test evaluated to false) -on Chrome and Safari (placeholder implemented and test evaluated to true) -on IE6+ (placeholder not implemented and test evaluated to false) see also http://diveintohtml5.org/detect.html#input-placeholder Regards, gren Thanks for the script, really useful.

the test
if ($.browser.webkit) return false;
doesn’t work (and $.browser is deprecated).

So, I propose another test :

if(‘placeholder’ in document.createElement(‘input’)) return false;

It works
–on Firefox (placeholder not implemented by ff3.6 and test evaluated to false)
–on Chrome and Safari (placeholder implemented and test evaluated to true)
–on IE6+ (placeholder not implemented and test evaluated to false)

see also http://diveintohtml5.org/detect.html#input-placeholder

Regards,
gren

]]> By: Ilia http://www.iliadraznin.com/2010/03/simple-jquery-placeholder-script-input-fields/#comment-317 Ilia Sun, 11 Apr 2010 22:11:45 +0000 http://iliadraznin.com/?p=166#comment-317 Great idea Brad, that gives me an idea for an even simpler solution. The trouble with checking color is that now javascript depends on CSS, unless you go through the trouble of extracting the color value from the .placeholder class (granted, with jquery it's not much trouble, but more than necessary). Instead of checking color we can simply check the class itself. If it's placeholder then we go ahead and clear the field (on focus), otherwise don't. In fact, if we have that then the value doesn't need to be checked at all, it can be whatever, but if the user put it there then it's not going to have "placeholder" class and so is not cleared on focus. Great idea Brad, that gives me an idea for an even simpler solution.

The trouble with checking color is that now javascript depends on CSS, unless you go through the trouble of extracting the color value from the .placeholder class (granted, with jquery it’s not much trouble, but more than necessary).

Instead of checking color we can simply check the class itself. If it’s placeholder then we go ahead and clear the field (on focus), otherwise don’t.

In fact, if we have that then the value doesn’t need to be checked at all, it can be whatever, but if the user put it there then it’s not going to have “placeholder” class and so is not cleared on focus.

]]> By: Brad http://www.iliadraznin.com/2010/03/simple-jquery-placeholder-script-input-fields/#comment-316 Brad Sun, 11 Apr 2010 21:26:21 +0000 http://iliadraznin.com/?p=166#comment-316 You can also check the current color of the text to see if it needs to be erased. If it's gray, it won't be erased even if it's the same as the placeholder text. You can also check the current color of the text to see if it needs to be erased. If it’s gray, it won’t be erased even if it’s the same as the placeholder text.

]]>