使用JavaScript怎么修改input和select的默认字体颜色?针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。
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="输入手机号">
关于使用JavaScript怎么修改input和select的默认字体颜色问题的解答就分享到这里了,希望以上内容可以对大家有一定的帮助,如果你还有很多疑惑没有解开,可以关注亿速云行业资讯频道了解更多相关知识。
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。