CODEWITHSUNDEEP
javascriptjqueryhtmlprototypejs
Chuck Le Butt
Chuck Le Butt

Reputation: 48758

JS: Empty an input field on click with Prototype

I originally used JQuery for this project, but now I'm having to use Prototype, and I'd like to take what I've written in JQuery and use it in Prototype.

It's a simple bit of code that empties the search bar when the user clicks on it. I'm sure it's pretty easy to do in Prototype, but I don't know how.

Here's what I wrote for JQuery... 

    $(window).load(function(){
        $("#search").on("click", function() {
            if ($(this).val() == "search") {
                $(this).val("");
                $(this).css("color", "black");
            }
        });
        $("#search").blur(function() {
            if ($(this).val() == "") {
                $(this).css("color", "gray");
                $(this).val("search");
            }
        });
    });

How can I convert the above for use with Prototype?

Upvotes: 1

Views: 673

Answers (1)

Chuck Le Butt
Chuck Le Butt

Reputation: 48758

For anyone who wants to do this in the future, here's what worked for me:

$('search').onblur = function() {
  if($('search').value == '') {
    $('search').value = 'search';
$('search').setStyle({color:'gray'});

  }
}

$('search').onfocus = function() {
  if($('search').value == 'search') {
    $('search').clear();
      $('search').setStyle({color:'black'});
  }
}

Upvotes: 1

Related Questions