Question

I need it to clear the default input value on focus, and bring the value back if the value is empty on blur. Here is my current code:

$(document).ready(function() {
    function toggleText(selector, value) {
        $(selector).focus(function() {
            if ($(this).val == value) {
                $(this).val('');
            }
        });
        $(selector).blur(function() {
            if ($(this).val == '') {
                $(this).val(value);
            }
        });
    }
    toggleText('input[name="first-name"]', 'First name...');
});

Answer 1

It’s $(this).val(), not $(this).val:

$(document).ready(function() {
    function toggleText(selector, value) {
        $(selector).focus(function() {
            if ($(this).val() == value) {
                $(this).val('');
            }
        });
        $(selector).blur(function() {
            if ($(this).val() == '') {
                $(this).val(value);
            }
        });
    }
    toggleText('input[name="first-name"]', 'First name...');
});

Edit:

But I think it’s better this way:

$(document).ready(function() {
    function toggleText(selector) {
        $(selector).focus(function() {
            if ($(this).val() == $(this)[0].defaultValue) {
                $(this).val('');
            }
        });
        $(selector).blur(function() {
            if ($(this).val() == '') {
                $(this).val($(this)[0].defaultValue);
            }
        });
    }
    toggleText('input[name="first-name"]');
});

you can use $(this).defaultValue() if you use this plugin.