如何在javascript中正确显示和隐藏图像？

Question

我一直有问题试图显示和隐藏我的ajax请求函数内的图像。为了清楚我想要做什么，我做了一个不到1分钟的视频click here。如果您在Web控制台中看到，有一个变量从“ocupado”变为“libre”，这意味着如果有空闲或忙碌的停车位。所以这是一种工作，因为在开始时我的变量"data" = ocupado显示一个汽车图像，然后当它更改为"data" = libre隐藏汽车图像。问题开始时，它再次更改为"data" = ocupado，因为它不显示任何汽车图像。

这是我对Ajax的功能

<script src="js/jQuery.js"></script> 
    <script type="text/javascript"> 
    setInterval(function(){ 
    $("img").error(function() { 
    $(this).unbind("error").attr("src", ""); 
    }); 
    $(function() 
    { 

    $.ajax({ 
     url: 'api.php', 
     data: "", 
     success: function(data) 
     { 
      console.log(data); 
      if (data === "libre"){ 
      $("#slave1free").hide(); 
      $("#slave1busy").hide(); 

      }else{ 
      $("slave1free").show(); 
      $("slave1busy").show(); 
      } 
     } 
     }); 
    }) 
    }, 1000); 

<div class="chart"> 
     <div class="chartimage"><img src="images/parkinglot.jpg"></div> 
     <div class="image" id = "esclavo1"> 
     <div class "free" id = "slave1free"><img src="images/carfree.png"></div>qQ 
     <div class "busy" id = "slave1busy"><img src="images/carbusy.png"></div> 
     </div> 

代码顺便说一句，carfree.png和carbusy.png是显示在视频旁边的“自由报estacionamiento”和“estacionamiento ocupado这些图像”。因为我打算根据数据的值（“libre”或“ocupado”）显示并隐藏两个图像，所以我将一个图像放在另一个图像的顶部。

编辑：是的，我正在隐藏这两个，并故意显示，因为我想看看问题出在哪里。尽管两者都在同时显示或隐藏，但当"data"=ocupado时，它会出现两个图像（一个在另一个的顶部）？

Answer 1

请注意，您隐藏了两个项目，或者同时显示它们......不应该是每个项目中的一个？

if (data === "libre") { 
    $("#slave1free").show(); 
    $("#slave1busy").hide(); 
} else{ 
    $("slave1free").hide(); 
    $("slave1busy").show(); 
} 

CNC中

只是意识到你缺少的ID选择器（＃）在其他

if (data === "libre") { 
    $("#slave1free").show(); 
    $("#slave1busy").hide(); 
} else{ 
    $("#slave1free").hide(); 
    $("#slave1busy").show(); 
}