通过js修改input、select默认字体颜⾊
textarea默认字颜⾊以及获取焦点后的字的颜⾊,焦点获取后使默认消失
<textarea cols="50" rows="5" id="textarea" onfocus="if(value=='获取到元素焦点'){value='';ElementById('textarea').lor='#000'}" onblur="if (value ==''){value='元素焦点消失';ElementById('textarea').lor='#999'}">输⼊您要输⼊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();
input绑定onblur事件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="输⼊⼿机号">
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论