使用JavaScript

Question

下面是一个示例代码，用于通过输入文本中的值更改InnerText上的颜色。

输出看起来像这样。颜色不变

function validate() {
  var msg;
  var result;
  if (document.myForm.userPass.value.length > 5) {
    msg = "good";
    result = msg.fontcolor("green");
  } else {
    msg = "poor";
    result = msg.fontcolor("red");
  }
  document.getElementById('mylocation').innerText = result;
}

<form name="myForm">
  <input type="password" value="" name="userPass" onkeyup="validate()"> Strength:
  <span id="mylocation">no strength</span>
</form>

here给出的答案不是我所需要的。

Answer 1

由于HTML5不使用字体标签，因此旧的fontcolor方法将无法在浏览器中使用。

所以我尝试了以下代码。

function validate() {
  var msg;

  if (document.myForm.userPass.value.length > 5) {
    document.getElementById('mylocation').style.color = "green";
    msg = "good";
  } else {
    document.getElementById('mylocation').style.color = "red";
    msg = "poor";
  }
  document.getElementById('mylocation').innerText = msg;
}

<form name="myForm">
  <input type="password" value="" name="userPass" onkeyup="validate()"> Strength:
  <span id="mylocation">no strength</span>
</form>
<hr/>