I have a textbox.When I click this I want to change text color style with javsacript.Before this I made succesfully this.When someone click the textbox textbox clear inner when blur textbox bee old version.This code works for me now

<input id="kullanici_adi_text" type="text" name="kullanici_adi_text"    value="Kullanıcı İsmini Giriniz..." onfocus="if(this.value=='Kullanıcı İsmini Giriniz...') {this.value='';}  onblur="if(this.value==''){this.value='Kullanıcı İsmini Giriniz...'}"/> 

But I want to change text color also and textbox border size when someone focus at this.The code is not working

<input id="kullanici_adi_text" type="text" name="kullanici_adi_text" value="Kullanıcı İsmini Giriniz..." onfocus="if(this.value=='Kullanıcı İsmini Giriniz...') {this.value=''; document.getElementById('kullanici_adi_text').style.color = 'blue';}"  onblur="if(this.value==''){this.value='Kullanıcı İsmini Giriniz...'; document.getElementById('kullanici_adi_text').style.color = #fff; }"/> 

I have a textbox.When I click this I want to change text color style with javsacript.Before this I made succesfully this.When someone click the textbox textbox clear inner when blur textbox bee old version.This code works for me now

<input id="kullanici_adi_text" type="text" name="kullanici_adi_text"    value="Kullanıcı İsmini Giriniz..." onfocus="if(this.value=='Kullanıcı İsmini Giriniz...') {this.value='';}  onblur="if(this.value==''){this.value='Kullanıcı İsmini Giriniz...'}"/> 

But I want to change text color also and textbox border size when someone focus at this.The code is not working

<input id="kullanici_adi_text" type="text" name="kullanici_adi_text" value="Kullanıcı İsmini Giriniz..." onfocus="if(this.value=='Kullanıcı İsmini Giriniz...') {this.value=''; document.getElementById('kullanici_adi_text').style.color = 'blue';}"  onblur="if(this.value==''){this.value='Kullanıcı İsmini Giriniz...'; document.getElementById('kullanici_adi_text').style.color = #fff; }"/> 

• javascript
• html
• css
• textbox

• 1 You appear to be missing quotes around your hexcode colour. You have this: document.getElementById('kullanici_adi_text').style.color = #fff; But it should be like this: document.getElementById('kullanici_adi_text').style.color = '#fff'; – Henders Commented Oct 23, 2015 at 16:26
• @AndyHenderson not working anyway – Tarık Akyüz Commented Oct 23, 2015 at 16:28

3 Answers 3

You should use quotas for color:

<input id="kullanici_adi_text" type="text"
   name="kullanici_adi_text"
   value="Kullanıcı İsmini Giriniz..." 
onfocus="if(this.value=='Kullanıcı İsmini Giriniz...')
    {this.value='';
     this.style.color = 'blue';}"  
onblur="if(this.value=='')
    {this.value='Kullanıcı İsmini Giriniz...';
     this.style.color = '#ff0000';}"/>

And as a reendation - it is better to sepatate javascript code from markup.

this would work
<input id="kullanici_adi_text" type="text" onfocus="myFunction()">

<script>
function myFunction() {
document.getElementById("kullanici_adi_text").style.color = "#ff0000";
document.getElementById("kullanici_adi_text").style.color = "magenta";
document.getElementById("kullanici_adi_text").style.color = "blue";
document.getElementById("kullanici_adi_text").style.color = "lightblue";
}
</script>

1.Include jQuery library in your document.

2.Include this script:

$(document).ready(function(){
   $('#kullanici_adi_text').focus(function(){
       $(this).css('color', 'red');
   }).focusout(function(){
       $(this).css('color', 'black');
   });
});