替换占位符文本的功能

Question

We've created a function to work as a substitute for placeholder text in fields, that should run if the browser hasn't support for the placeholder attribute (ie early IE browsers).

However, it doesn't seem to work and we can't figure out the reason. Could you see what's wrong?

setup_placeholders = (function() {
    $.support.placeholder = false;
    test = document.createElement('input');
    if('placeholder' in test) {
        $.support.placeholder = true;
        return function() {}
    } else {
        return function(){
            $(function() {
                var active = document.activeElement;
                $('form').delegate(':text', 'focus', function () {
                    var _placeholder = $(this).attr('placeholder'),
                        _val = $(this).val();
                    if (_placeholder != '' && _val == _placeholder) {
                        $(this).val('').removeClass('hasPlaceholder');
                    }
                }).delegate(':text', 'blur', function () {
                    var _placeholder = $(this).attr('placeholder'),
                        _val = $(this).val();

                    if (!_placeholder && ( _val == '' || _val == _placeholder)) {
                        $(this).val(_placeholder).addClass('hasPlaceholder');
                    }
                }).submit(function () {
                    $(this).find('.hasPlaceholder').each(function() { $(this).val(''); });
                });
                $(':text').blur();
                $(active).focus();
            });
        }
    }
})();

Answer 1

JQuery approach :

(function($) {
    var safe = [];
    $.fn.store = function() {
        safe[$(this).attr('id')] = $(this).val();
        $(this).click(function() {if ($(this).val() == safe[$(this).attr('id')]) $(this).val('');});
        $(this).blur(function() {if ($(this).val() == '') $(this).val(safe[$(this).attr('id')]);});
    };
}( jQuery ));

Usage :

<input type="text" id="txt_field" name="txt_field" value="Placeholder">
<script>
    $('#txt_field').store();
</script>