Firefox: lose focus when clear textbox value

Question

I have a search box (textbox) and I want to clear it's content when I click inside. (some kind of watermark. Watermark control was not good for me in this case). I am using "onKeyDown" event to clear the content:

 function clearTbSearch(tbSearch) {

        if (tbSearch != null && tbSearch.value == '<%= TypeHereText %>') {

            tbSearch.value = "";


            tbSearch.style.color = "#000000";

        }
        return true;
    }

It works fine in IE and Chrome but in Firefox it takes 3 (!!!) clicks to get it focused. First click does not do anything. The second one clears the textbox but do not focus. The third click get the cursor focused. I tried anything... I would be glad for any suggestions... Thanks!!!

Answer 1

No need to use onkeydown event, just use the generic onfocus instead:

var firstTime = true;
window.onload = function() {
    var input = document.getElementById("MyInput");
    input.onfocus = function() {
        if (!firstTime)
            clearTbSearch(this);
        firstTime = false;
    };
    input.focus();
};

This way it will work either by keyboard focus or mouse focus eg when clicking the textbox.

Answer 2

你可以尝试这个让它看起来更干净：

<input type="text" name="myInput" value="Your initial trademark" onfocus="this.value=''" />