Totally rad HTML I just wrote

Jacob Bijani:

<input type="text" class="text_field placeholder_content"
    value="Default value"
    onfocus="
        if (this.className == 'text_field placeholder_content') {
            if (! this.getAttribute('default_value')) {
                this.setAttribute('default_value', this.value);
            }
            this.value = '';
            this.className = 'text_field';
        }
    "
    onblur="
        if (! this.value) {
            this.value = this.getAttribute('default_value');
            this.className = 'text_field placeholder_content';
        }
    "
/>

Clears an input on focus and refills it on blur with the default value if it’s still empty. Totally localization-friendly, framework-agnostic, and you get to use CSS to style both states!

Totally just used this.


Posted

in

by