JSFiddle - React, Tailwind, and code Playground

by nikolya223

HTML

<div id="searchWrap_lvl2"><input type="text" name="search_field" id="keywords" value="Поиск" ></div>
<script type="text/javascript">
    $("#keywords").click( function(){
        var search_fieldVal =   $('#keywords').attr('value');    
        if (search_fieldVal =="Поиск"){        
           $('#keywords').attr('value','') ;
        } 
    });
    
    $("#keywords").click( function(){
        var search_fieldVal =   $('#keywords').attr('value');    
        if (search_fieldVal =="Поиск на сайте, введите запрос ..."){        
           $('#keywords').attr('value','') ;
        } 
    });
    $("#keywords").blur( function(){
        var search_fieldVal =   $('#keywords').attr('value');    
        if (search_fieldVal =="Поиск"){        
           $('#keywords').attr('value','Поиск на сайте, введите запрос ...') ;
        } 
    });
    
  

</script>

CSS

#searchWrap_lvl2 {
        
        border: 1px solid #ccc;
        display: inline;
        padding-left: 35px;
        padding-bottom: 7px;
        padding-top: 5px;
        padding-right: 2px;
        border-radius: 4px;
        background: url(../images/images.jpg) no-repeat;
}
#keywords{
        border: 0px;
        height: 25px;
        width: 350px;
        color: grey; 
        
}