HTML Placeholder not working in IE9 and earlier!!

Recently found this very useful jQuery plugin for fixing placeholder issues in old IE browsers. It seems to cover most scenarios and is very easy to  implement 🙂

https://github.com/mathiasbynens/jquery-placeholder

Just add the script after the jQuery and call

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

You will also need to add the placeholder style in your css.

/* Placeholder fix for IE9 for use with jQuery.placeholder plugin */
 .placeholder { color: #aaa; }

If you are a c# razor person, something like this on your impacted pages will do the trick (assuming you something like

@RenderSection("MyJavaScript", false)

in your layout).

@section MyJavaScript
 {
 <script src="@Url.Content("~/Scripts/jquery.placeholder/jquery.placeholder.js")" type="text/javascript"></script>
 <script>
 $('input, textarea').placeholder();
 </script>
 }

One thought on “HTML Placeholder not working in IE9 and earlier!!

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.