Использование плагина, такого как watermark.js, для добавления выделенного серым цветом текста подсказки в поле поиска таблицы данных JQuery не вариант, я должен написать его индивидуально. Я почти готов, но столкнулся с этой незначительной и странной проблемой, описанной ниже в следующем фрагменте кода.

function toggleHintText()
{
    // alert("The hint text should show up"); 
    var textSuggest = "Please input search parameter";
    var searchField = $('input:text');

    searchField .attr("value", textSuggest );
    searchField .addClass("activeHint");

    searchField .focus(function() {
    if(searchField .attr("value") == textSuggest)
    {
        searchField .attr("value", "");
    }
    });

    searchField .keyup(function() {             
    if(searchField .attr("value") == "") 
    {
      searchField .addClass("activeHint");
    }
    else
    {
      searchField .removeClass("activeHint");   
    }
    });     

    searchField .blur(function() {
    if(searchField .attr("value") == "")
    {
        searchField .attr("value", hinttext);
        searchField .addClass("activeHint");
    }
    });   

}

Этот метод вызывается onload, как показано ниже

$(document).ready(function() {
populateTableData();
toggleHintText();
} );

================================= ================================================== ========

Проблема, с которой я столкнулся, заключается в том, что без предупреждения, которое у меня есть в начале метода, текст подсказки не отображается в поле поиска. Работает ли предупреждение как-то в пользу document.ready? Не портит ли вызов двух методов из document.ready метод toggleHint? Одно из моих требований - сохранить вводимый пользователем текст для поиска, если он щелкает строку таблицы после поискового запроса, а затем нажимает настраиваемую кнопку возврата, поэтому я должен вызывать ее из document.ready.

Пожалуйста, сообщите заранее и спасибо.