Question

我从dart开始，我得到了我的第一个问题。

当我点击它时，我想制作着色行。

默认我有backgroundColor白色，当我点击它变为黄色，但当我点击黄色时，它不再变为白色

代码：

 void changeText(MouseEvent event) {
  if(querySelector("#Column_1").style.backgroundColor == 'Yellow')
    querySelector("#Column_1").style.backgroundColor = 'White';

  else querySelector("#Column_1").style.backgroundColor = 'Yellow';
}

Answer 1

即使将它们设置为大写，值也会返回小写。如果它们不相同，则比较失败。

void changeText(MouseEvent event) {
  var col = querySelector('#Column_1'); 
  if(col.style.backgroundColor.toLowerCase() == 'white') {
    col.style.backgroundColor = 'yellow';
  } else {
    col.style.backgroundColor = 'white';
  }
}

我不知道为什么我之前没有从样式属性中获得任何价值，但现在这对我有用。

无论如何，我建议使用CSS和类。

当你将它放在HTML的<head>或你的CSS文件中时，如果你使用一个

<style>
  .isSelected {
    background-color: yellow;
  }
</style>

并将您的textChange方法更改为

void changeText(MouseEvent event) {
  var col = querySelector('#Column_1').classes.toggle("isSelected");
}

你应该得到你想要的效果。

onClick背景颜色变化

1 个答案: