javascript显示/隐藏div'；s基于*多个*选择

我正在为我的家具公司建立一个网站，并在自学一些javascript。我的产品有两个变量，woodtype（按钮）和tablesize（下拉菜单）。我的电子商务api要求每个产品具有唯一的“添加到购物车”div。我想根据唯一的woodtype和tablesize选择显示/隐藏适当的“添加到购物车”（var atc）div。这是我的密码。不知道我做错了什么

感谢您的帮助

var atc=“woodtype”+“tablesize”；
木本变种；
var表大小；
$（文档）.ready（函数（）{
$（'#SELECTSIZE'）。在（'change'，function（）上{
如果（this.value='2'）
{
var tablesize=“2”；
}
else if（this.value==“4”）
{
var tablesize=“4”；
}
else if（this.value==“8”）
{
var tablesize=“8”；
}
其他的
{
var tablesize=“6”；
}
});
});
$（文档）.ready（函数（）{
$（'#SELECTWOOD'）。在（'change'，function（）上{
如果（this.value==“MAPLE”）
{
var woodtype=“M”；
}
其他的
{
var woodtype=“W”；
}
});
});
$（文档）.ready（函数（）{
如果（atc=“M4”）
{
$（“#M4”）.show（）；
}
其他的
{
$（“#M4”）.hide（）；
}

实核桃
实心枫木


双座（30英寸）
4-6座（60英寸）
6座（76英寸）
8座（84英寸）


添加到CART1

添加到CART2

添加到CART3

添加到CART4

添加到CART5

添加到CART6

添加到CART7

添加到CART8

我看到的第一件事是，通过多次重新定义tablesize变量，您正在重写它

例如：

var tablesize;

$(document).ready(function(){
    $('#SELECTSIZE').on('change', function() {
      if ( this.value == '2')
      {
       tablesize = "2";
      }
      else if ( this.value == '4')
      {
       tablesize = "4";
      }
      else if ( this.value == '8')
      {
       tablesize = "8";
       }
      else
      {
       tablesize = "6";
      }
    });
});

---

有许多事情可以做得不同

这样就为相应的div构建了select

var-atc；
木本变种；
var-tablesize=2；
$（'#SELECTSIZE'）。在（'change'，function（）上{
如果（this.value=='2'）
{
tablesize=“2”；
}
else if（this.value==“4”）
{
tablesize=“4”；
}
else if（this.value==“8”）
{
tablesize=“8”；
}
其他的
{
tablesize=“6”；
}
doit（）；
});
$（“#maple”）。单击（函数（）{
woodtype=“M”；
doit（）；
});
$（“#胡桃木”）。单击（函数（）{
woodtype=“W”；
doit（）；
});
函数doit（）{
atc=woodtype+表大小；
控制台日志（“atc:+atc”）；
//隐藏所有的购物车div
$（“.cartdiv”）.hide（）；
//取消隐藏所选的一个
$（“#”+atc）.show（）；
}

实核桃
实心枫木


双座（30英寸）
4-6座（60英寸）
6座（76英寸）
8座（84英寸）


添加到CART1

添加到CART2

添加到CART3

添加到CART4

添加到CART5

添加到CART6

添加到CART7

添加到CART8

gotcha-那么我如何在选择时获得要更改的变量值而不覆盖它呢？在上一个文档中。准备就绪，您需要重新计算atc值，即

var atc=woodtype+tablesize

。这是需要的，因为在当前状态下，atc值为“woodtypetablesize”我相信这不是您想要的。此外，您应该在

if（atc=“M4”）中使用
===
（比较运算符）而不是
=
（赋值运算符）

您好，恕我直言，但lot’s在这里是错误的。我可以理解您想要一哄而起，但您可能确实需要先查阅一些书籍/教程。首先，您不需要2个document/ready块，并且您的变量属于其中。其次，您可以简单地使用if语句，而不是所有if语句有一句话：

tablesize=this.value

（或woodtype，视情况而定）。这些更改将使调试和/或解释代码变得更加容易。哇！非常感谢您的帮助。工作非常出色。