Question

我有一个输入文本，我想将默认文本包含为灰色，然后如果它获得焦点，请清除默认文本并将文本颜色更改为黑色。清除文本有效，但是当我开始输入时，文本仍然是灰色而不是黑色。我有：

<input class="TB_DEFAULT" type="text" id="txtValue" value="enter notice or order" style="color:lightgray" onchange="this.style='color:black'" onfocus="if(this.value=='enter notice or order') this.value='';" />

Answer 1

添加占位符标签应该可以在没有任何javascript的情况下完成。

试试这个：

<input class="TB_DEFAULT" type="text" id="txtValue" placeholder="enter notice or order"/>

添加一些CSS示例以帮助设置占位符文本的样式：

::-webkit-input-placeholder {
color: red;
}

:-moz-placeholder { /* Firefox 18- */
color: red;  
}

::-moz-placeholder {  /* Firefox 19+ */
color: red;  
}

:-ms-input-placeholder {  
color: red;  
}

Answer 2

＆＃13;

$(document).ready(function() {
  $("#txtValue").css('color', '#cfcfcf');
  $("#txtValue").val('enter notice or order');

  $("#txtValue").on('focus', function() {
    $("#txtValue").css('color', '#000000');
    $("#txtValue").val('');
  })
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input class="TB_DEFAULT" type="text" id="txtValue">

＆＃13;

HTML更改输入文本颜色和清晰值焦点

2 个答案: