Question

我有这个jsfiddle，我想改变输入文本的背景颜色，如果单词是好的类型，而另一个，如果单词不是很好的类型。它目前无法正常工作，但我在控制台中没有出错。如果你们可以帮助我。

这是js函数，我记录每一步并没有收到错误：

function isCorrect() {
  var test = document.getElementById('test').value;
  if (test.value === "hello") {
    test.classname = "correct"
    return true;
  } else {
    test.classname = "incorrect"
    return false;
  }
}

Answer 1

var test = document.getElementById('test').value;
if (test.value === "hello") {

您已拨打.value两次。把它从第一行拿下来，因为否则你将className（顺便说一句，应该是驼峰）添加到字符串值而不是输入元素。

以下是更正后的代码和working copy：

function isCorrect() {
    var test = document.getElementById('test');
    if (test.value === "hello") {
        test.className = "correct";
        return true;
    } else {
        test.className = "incorrect";
        return false;
    }
}

它正确地添加了这个类，但是你的CSS被覆盖了所以我只是删除了默认颜色以便插图。

Answer 2

你正在加倍重视价值观：

var test = document.getElementById('test').value;
                                          ^^^^^^
if (test.value === "hello") {
        ^^^^^^

test ALREADY是该输入的值，这意味着它是一个纯字符串。字符串没有.value属性，因此您正在执行undefined === "hello"。

Also use className not classname
              ^             ^

Answer 3

您有一些错误：

关键字为className而不是classname。请改变它。
您已经获得了.value。无需再次打电话。

更正后的代码：

function isCorrect() {
  var test = document.getElementById('test').value;
  if (test === "hello") {
    test.className = "correct"
//------------^
    return true;
  } else {
    test.className = "incorrect"
//------------^
    return false;
  }
}

按下提交时更改输入的样式

3 个答案: