Question

我有这个方块，用构造函数创建，我的所有数据都会更新，包括它的.style.top和.style.left，但它不会在页面上更新（图片）。这是我的代码，我省略了构造函数本身，因为它可能不是问题。我已经包含了构造函数的方法和方法的调用，它不会更新图片。

  KeyBlock.prototype.move = function(event) {
  if(event.keyCode == 37)
    this.x -= 10;
  if(event.keyCode == 38)
    this.y -= 10;
  if(event.keyCode == 39)
    this.x += 10;
  if(event.keyCode == 40)
    this.y += 10;
  if (this.y < 0)
    this.y = 0;
  if (this.x < 0)
    this.x = 0;
  this.character.style.left = String(this.x) + "px";
  this.character.style.top = String(this.y) + "px";
  console.log(this.character.style.left);
}

me = new KeyBlock("me");
addEventListener("keyup", KeyBlock.prototype.move.bind(me));

如果你想看到构造函数，可以在这个问题上找到它，但可能不需要回答这个问题：Event Handler function in prototype's method, why does it think .keyCode is a property of undefined in JavaScript?

提前谢谢：）

Answer 1

在您在此问题或链接构造函数中显示的代码中，您为角色提供了position样式值。要使style.left和style.top执行任何操作，您必须将style.position值设置为默认值static以外的值。

仅供参考，当您向字符串添加数字时，您不需要手动将事物转换为字符串（该数字将被自动转换）。所以不要这样：

this.character.style.left = String(this.x) + "px";

你可以这样做：

this.character.style.left = this.x + "px";

在JavaScript中进行数据更新后，我的DOM对象不会更新

1 个答案: