Javascript 学习在wix'上创建基本颜色分配工具；斯维洛

下图是我的wix编辑器的屏幕截图，我正在尝试创建一个基本的颜色赋值器，该赋值器应该为大框指定被某人单击的按钮的颜色

请检查并了解我使用的代码不起作用的原因。 这是代码

$w.onReady(function () {
    // Selectors for all the Container boxes
    const bigBox = $w('#box0');
  const boxColor = bigBox.style.backgroundColor;
  const firstButton = $w('#button1');
  const firstcolor = firstButton.style.backgroundColor;
    const secondButton = $w('#button2');
  const secondColor = secondButton.style.backgroundColor;
    const thirdButton = $w('#button3');
  const thirdColor = thirdButton.style.backgroundColor;
    const fourthButton = $w('#button4');
  const fourthColor = fourthButton.style.backgroundColor;


    firstButton.onClick(event => {
     boxColor = firstcolor;
     });
    secondButton.onClick(event => {
      boxColor = secondColor;
     })
    thirdButton.onClick(event => {
      boxColor = thirdColor;
    })
    fourthButton.onClick(event => {
      boxColor = fourthColor;
    }) 
});

---

无法按尝试的方式为长方体指定颜色。您当前正在做的是将框的初始值存储在变量中，然后仅更改该变量的值。当您更改变量时，它不会对框做任何操作。相反，您需要实际更改框的

backgroundColor

的值

因此，代码的底部应该是这样的：

firstButton.onClick(event => {
  bigBox.style.backgroundColor = firstcolor;
});
secondButton.onClick(event => {
  bigBox.style.backgroundColor = secondColor;
})
thirdButton.onClick(event => {
  bigBox.style.backgroundColor = thirdColor;
})
fourthButton.onClick(event => {
  bigBox.style.backgroundColor = fourthColor;
}) 

你可以去掉上面的这一行：

const boxColor = bigBox.style.backgroundColor;