Home/ Questions/Q 7492901
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-29T16:39:14+00:00

I have a form which the client wants the labels inside the input box

  • 0

I have a form which the client wants the labels inside the input box and I decided to use HTML 5’s placeholder and Google’s html5shiv, instead of the old javascript. My placeholders, however, don’t seem to work properly in IE, which is what I was using the shiv for. Here is the code:

Doctype:

<!DOCTYPE html>

Shiv:

<!--[if IE]>
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js" type="text/javascript"></script>
<![endif]-->

Form: 

<form method="post" enctype="multipart/form-data" name="contactForm" id="contactForm">

    <input type="text" name="name" id="name" placeholder="Your Full Name..." />
    <input type="text" name="telephone" id="telephone" placeholder="Your Telephone Number..." />
    <input type="email" name="email" id="email" placeholder="Your Email Address..." />
    <textarea name="enquiry" id="enquiry" placeholder="Your Enquiry or Comments..."></textarea>
    <p class="midpadLeft green_Button_margin_2"><span class="green_Button_2"><a href="javascript: document.contactForm.submit();" target="_self" class="green_Button_2">Submit Enquiry <img src="images/mid-envelope.png" alt="Submit"/></a></span></p>

</form>

Any ideas as to why it’s not working?

Revision:

Using code suggested in the comments below, I have changed my code to the following, but it is still not working.

Script including (the contents of that script was copied directly from here):

<script type="text/javascript" src="scripts/placeholders.js" charset="utf-8"></script>

DOM ready event listener:

<body onload="Placeholders.init(true);">
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The HTML5 Shiv simply enables styling for previously unknown elements in IE. The most recent version does a few things extra, like patching document.createElement, but other than that it doesn’t polyfill anything.

    If you want to emulate placeholder, use a placeholder polyfill. I’ve written one in jQuery plugin format, if you’re interested: http://mths.be/placeholder

    Use it as follows:

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

    Here’s a demo: http://mathiasbynens.be/demo/placeholder

    Btw, you should be using <label> instead of @placeholder if the text is “Your Full Name” etc.

    • 0