Question

我正在使用Form，其中txt框已经有一些值，当某些用户点击txt框内部时会改变。字体颜色略微设置为浅色。因此，当用户键入内容时，字体颜色应更改为深色并应保持黑暗。是否有任何java脚本来执行此操作。

<html>
<head>
<style type="text/css">
.formWrapper input[type="text"]{float:left; width:178px; height:28px; line-height:27px; padding-left:5px; color:#CACACA; font-size:13px; font-weight:bold;}
</style>
</head>
<body>
<div class="formWrapper">
<form name=form>
<Input type="text" name="name1"  value="Eg : Flat-27,Block 4,Skyline" onfocus="if(this.value==this.defaultValue) this.value='';" onblur="if(this.value=='') this.value=this.defaultValue;" size="30">
</form>
</div>
</body>

Answer 1

在我的例子中：

on focus默认文本将被清除，输入元素将变为绿色
on blur如果输入没有填充默认灰色文本的文本

代码：

$('input').focus(function(){
     if($(this).val() == this.defaultValue){$(this).val('');$(this).css("color","green");}
}).blur(function(){
     if($(this).val() == ''){$(this).val(this.defaultValue);$(this).css("color","grey");}
});

HTML：

<div class="formWrapper">
<form name=form>
<Input type="text" name="name1"  value="Eg : Flat-27,Block 4,Skyline" size="30">
</form>
</div>

Live demo

Answer 2

$("element").keydown(function() {
  this.value= "";
  $(this).css("color",darkcolorCode);
}).blur(function(){
    if( this.value == "default text" || $.trim(this.value) == "" ) {
       this.value == "default text";
        $(this).css("color",lightcolorCode);
    }
});

更改文本颜色Onfocus事件或用户键入内容时

2 个答案: