Textarea default word color and the color of the word after obtaining the focus. After obtaining the focus, the default disappears after obtaining the focus.
<textarea cols="50" rows="5" onfocus="if(value=='Get the element focus'){value='';('textarea').='#000'}" onblur="if (value ==''){value='Element focus disappears';('textarea').='#999'}">Enter what you want to enter</textarea>
Select default selected item color is gray, and it becomes black after selection (js implementation)
<script> var unSelected = "#999"; var selected = "#333"; $(function () { $("select").css("color", unSelected); $("option").css("color", selected); $("select").change(function () { var selItem = $(this).val(); if (selItem == $(this).find('option:first').val()) { $(this).css("color", unSelected); } else { $(this).css("color", selected); } }); }) </script>
Input has a default value and is gray. After clicking, the default value disappears and the input value becomes black
<script type="text/javascript"> $(function() { //The collective call input of type text is input $(".form input[text]").each(function(){ $(this).setDefauleValue(); }); //Single call $("#key").setDefauleValue(); }) //Set the default value$. = function() { var defauleValue = $(this).val(); $(this).val(defauleValue).css("color","#eee"); return (function() { $(this).focus(function() { if ($(this).val() == defauleValue) { $(this).val("").css("color","#000");//Input the color of the value } }).blur(function() { if ($(this).val() == "") { $(this).val(defauleValue).css("color","#999");//Default value color } }); }); } </script> </head> <body> <form class="form"> <input type="text" size="30" value="Enter an account"> <br> <input type="text" size="30" value="Enter Password"> </form> <br> <br> <br> <input type="text" size="30" value="Enter your phone number">