首页 > 编程 > JavaScript > 正文

通过js修改input、select默认字体颜色

2019-11-19 16:47:22
字体:
来源:转载
供稿:网友

textarea默认字颜色以及获取焦点后的字的颜色,焦点获取后使默认消失

<textarea cols="50" rows="5" id="textarea" onfocus="if(value=='获取到元素焦点'){value='';document.getElementById('textarea').style.color='#000'}" onblur="if (value ==''){value='元素焦点消失';document.getElementById('textarea').style.color='#999'}">输入您要输入的内容</textarea>

select默认选中项颜色为灰色,选择后变为黑色(js实现)

<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有默认值,且为灰色,点击后默认值消失,输入值变为黑色

<script type="text/javascript">$(function() {  //集体调用类型为text的input  $(".form input[text]").each(function(){    $(this).setDefauleValue();  });  //单个调用  $("#key").setDefauleValue();}) //设置默认值$.fn.setDefauleValue = function() {  var defauleValue = $(this).val();  $(this).val(defauleValue).css("color","#eee");   return this.each(function() {       $(this).focus(function() {      if ($(this).val() == defauleValue) {        $(this).val("").css("color","#000");//输入值的颜色      }    }).blur(function() {      if ($(this).val() == "") {        $(this).val(defauleValue).css("color","#999");//默认值的颜色      }    });  });}</script></head> <body><form class="form"> <input type="text" size="30" value="输入账户"> <br> <input type="text" size="30" value="输入密码"></form><br><br><br><input type="text" size="30" id="key" value="输入手机号">

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表