Màu văn bản của trường nhập liệu CSS của văn bản được nhập

Question

Tôi có trường nhập và màu văn bản trong đó có màu đen. (Tôi đang sử dụng jquery.placeholder) Giả sử văn bản trong đó có "E-Mail"

Khi bạn nhấp vào trường này, văn bản giữ chỗ màu đen sẽ biến mất (nhờ jquery.placeholder).

Bất kỳ văn bản nào được nhập vào trường này, tôi muốn nó chuyển sang màu đỏ và khi bạn bỏ chọn trường này, tôi muốn màu đỏ.

Hiện tại, văn bản cho biết "E-Mail" có màu đen và mọi thứ tôi nhập là màu đỏ, điều này thật tuyệt, nhưng ngay khi tôi bỏ chọn, nó sẽ chuyển sang màu đen. Ai giúp tôi với? Tôi muốn văn bản ở lại màu đỏ, ngay cả sau khi nó được bỏ chọn. Đây là mã của tôi

textarea:focus, input:focus { 
    color: #ff0000; 
} 

input, select, textarea{ 
    color: #000; 
} 

Answer 1

Thay đổi phong cách thứ hai của bạn như thế này:

input, select, textarea{ 
    color: #ff0000; 
} 

Hiện tại, bạn đang yêu cầu biểu mẫu thay đổi văn bản thành black khi tiêu điểm tắt. Các biện pháp trên đó.

Ngoài ra, bạn nên đặt kiểu trạng thái bình thường trước kiểu :focus và :hover trong biểu định kiểu của mình. Điều đó giúp ngăn chặn vấn đề này. Vì vậy,

input, select, textarea{ 
    color: #ff0000; 
} 

textarea:focus, input:focus { 
    color: #ff0000; 
} 

Answer 2

thay thế:

input, select, textarea{ 
    color: #000; 
} 

với:

input, select, textarea{ 
    color: #f00; 
} 

hoặc color: #ff0000;

Answer 3

tôi luôn luôn làm đầu vào nhắc nhở, như thế này:

<input style="color: #C0C0C0;" value="someone@somewhere.com" 
    onfocus="this.value=''; this.style.color='#000000'"> 

Tất nhiên, nếu người dùng của bạn tràn ngập trong lĩnh vực này, những thay đổi tập trung quay trở lại với lĩnh vực này, lĩnh vực này sẽ một lần nữa được đã xóa. Nếu bạn làm như vậy, hãy chắc chắn đó là những gì bạn muốn. Bạn có thể làm cho nó một điều một thời gian bằng cách thiết lập một semaphore, như thế này:

<script language = "text/Javascript"> 
    cleared[0] = cleared[1] = cleared[2] = 0; //set a cleared flag for each field 
    function clearField(t){     //declaring the array outside of the 
    if(! cleared[t.id]){      // function makes it static and global 
     cleared[t.id] = 1; // you could use true and false, but that's more typing 
     t.value='';   // with more chance of typos 
     t.style.color='#000000'; 
     } 
    } 
    </script> 

< đầu vào > lĩnh vực của bạn sau đó trông như thế này:

<input id = 0; style="color: #C0C0C0;" value="someone@somewhere.com" 
    onfocus=clearField(this)>