jquery在javascript函数中隐藏div数组

Question

我在javascript函数中使用jquery来隐藏和显示div。我只需要显示div“区域”，而隐藏其他div。

当我直接将div的名字隐藏并显示：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">
</script>

<script>

function area_visible()
{


  $('.Area').show();
  $('.Area-1').hide();
  $('.Area-2').hide();
  $('.Area-3').hide();


}

如果我尝试使用div类的数组进行访问，则此方法无法工作，甚至警报消息也不显示4次循环：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">
</script>

<script>

var area_id = [
    "Area" , "Area-1", "Area-2", "Area-3"
];



function area_visible()
{

  $(area_id).each(function(index, element) {
        if(element != area_id[0] )
        {
          $("#" + element).hide();
        }
      alert('11');
    });


}

请建议一下。如何通过从数组中获取名称来隐藏和显示div (我希望在javascript函数中使用jquery )？

Answer 1

变化

$("#" + element).hide();

至

$("." + element).hide();

您正试图锁定一个ID，您必须使用.来锁定类。

Answer 2

在第一个函数中，您使用的是类$('.Area-1')，使用ID $("#"+element)选择的是第二个函数。

因此，修复方法很容易，只需将“#”改为“。”在第二个函数中

Answer 3

您必须将id选择器更改为类选择器，并启动该函数：

$("." + element).hide(); // for your second function.

并初始化您的函数：

area_visible(); // for both it will work.