onBlur attribute is not working with a condition

Question

I am trying to style a search box with the onFocus and onBlur attributes, but i don't get the expected result. Here is my HTML code

<form action="index.php" method="post" class="search">
<input name="searchword" id="mod_search_searchword" maxlength="20" 
type="text" size="30" value="Search..." 
onblur="if(this.value=='') {this.value='Search...'; this.className='search-default';}
elseif(this.value!='' && this.value!='Search...') {this.className='search-userinput';}"
onfocus="if(this.value=='Search...') {this.value=''; this.className='search-userinput';} 
else {this.className='search-userinput';}" class="search-userinput">    
<input type="hidden" name="option" value="com_search">
<input type="hidden" name="task" value="search">
</form>

If I don't set a condition for the onBlur attribute, then the onFocus bit works, but I need both to work. What solutions do I have?

Answer 1

this will work:

        <script>
        function setb(obj)
        {
            if(obj.value=='')
            {obj.value='Search...'; obj.className='search-default';}
            else if(obj.value!='' && obj.value!='Search...') 
            obj.className='search-userinput';
        }
        function setf(obj)
        {
            if(obj.value=='Search...') 
            {obj.value=''; obj.className='search-userinput';} 
            else 
            obj.className='search-userinput';
        }
        </script>

        <form action="index.php" method="post" class="search">
        <input name="searchword" id="mod_search_searchword" maxlength="20" 
        type="text" size="30" value="Search..." 
        onblur="setb(this)"
        onfocus="setf(this)" class="search-userinput">    
        <input type="hidden" name="option" value="com_search">
        <input type="hidden" name="task" value="search">
        </form>

and we dont have elseif ! that's else if.