Question

I realize how simple this question should be to answer but I am in a medication fog and the answer is escaping me.

I would like to make this into a simple function to display specific text if the value of the text box is empty upon mouseout and to empty out the text value upon mouseover.

What I have right now that works but is very ugly:

$(".disappearOnClick").live('mouseover',function() {    
            if($(this).val() === 'BFA Offset') {
                $(this).val('')
            }
        });

    $(".disappearOnClick").live('mouseout',function() {
            if($(this).val() === '') {
                $(this).val('BFA Offset')
            }
        });

Answer 1

You can bind to multiple events using the live() method – so you could use something like this ->

$('.disappearOnClick').live('mouseover mouseout', function(event) {
  if (event.type == 'mouseover') {
     if($(this).val() === 'BFA Offset') {
            $(this).val('');
        }
  } else {
    if($(this).val() === '') {
            $(this).val('BFA Offset');
        }
  }
});