切换颜色声明 -

Question

我正在寻找为我的拖动功能制作一个 switch 语句。 基本上希望能够单击下面提到的四个按钮之一，并将拖动和颜色功能切换为按钮的颜色。

• 更新，我现在已经解决了这个问题 27/04

  ---

  08:00-16:30 08:30-17:00 09:00-17:30 09:30-18:00 集合

    <script>
  var box;
  var boxArray;
  var backgroundColor;
  var text;
  boxArray = [];
  
  box = document.getElementsByClassName("sidebar");
  for ( var i = 0; i < box.length; i++ ) (function(i){
  box[i].onmousemove = function(e) {
  if(e.buttons == 1)
  box[i].style.backgroundColor = backgroundColor, box[i].innerHTML = text, box[i].style.fontSize = "10px", box[i].style.padding = "4px";
  }
  })(i);
  
  document.addEventListener("contextmenu", function (e) {
  e.preventDefault();
  }, false);
  
  
  
  function changeColor(color){
    switch(color) {
      case 'o' :
        backgroundColor = "orange";
        text = "08:00-16:30";
        break;
      case 'r' :
        backgroundColor = "red";
        text ="08:30-17:00";
        break;
      case 'g' :
        backgroundColor = "green";
        text ="09:00-17:30";
        break;
      case 'p' :
        backgroundColor = "purple";
        text ="09:00-17:30";
      }
    }
  

Answer 1

您 switch 语句在语法上不正确。您需要提供一个参数来比较您的 switch case，并且在 switch 语句中，您不使用花括号。

类似这样的：

switch (color) {
   case "o":
     backgroundColor = "orange";
     break;
   case "r":
     backgroundColor = "red";
     break;
   case "g":
     backgroundColor = "green";
     break;
   case "p":
     backgroundColor = "purple";
     break;
}

请注意，“o”、“r”、“g”和“p”在引号中，那是因为它们是字符串值，如果您省略引号，就像在代码示例中所做的那样，JavaScript会将它们解释为变量，这只是未定义的。

Answer 2

我自己现在刚刚解决了这个问题 -

      <script>
    var box;
    var boxArray;
    var backgroundColor;
    var text;
    boxArray = [];

    box = document.getElementsByClassName("sidebar");
    for ( var i = 0; i < box.length; i++ ) (function(i){
    box[i].onmousemove = function(e) {
    if(e.buttons == 1)
    box[i].style.backgroundColor = backgroundColor, box[i].innerHTML = text, box[i].style.fontSize = "10px", box[i].style.padding = "4px";
    }
    })(i);

    document.addEventListener("contextmenu", function (e) {
    e.preventDefault();
    }, false);



    function changeColor(color){
      switch(color) {
        case 'o' :
          backgroundColor = "orange";
          text = "08:00-16:30";
          break;
        case 'r' :
          backgroundColor = "red";
          text ="08:30-17:00";
          break;
        case 'g' :
          backgroundColor = "green";
          text ="09:00-17:30";
          break;
        case 'p' :
          backgroundColor = "purple";
          text ="09:00-17:30";
        }
      }



      </script>

Answer 3

开关（e.目标） { 红色案例： body.style.backgroundColor="红色"; 打破；

黄色外壳： body.style.backgroundColor="黄色"; 打破；

}