我一直有问题试图显示和隐藏我的ajax请求函数内的图像。为了清楚我想要做什么,我做了一个不到1分钟的视频click here。如果您在Web控制台中看到,有一个变量从“ocupado”变为“libre”,这意味着如果有空闲或忙碌的停车位。所以这是一种工作,因为在开始时我的变量"data" = ocupado
显示一个汽车图像,然后当它更改为"data" = libre
隐藏汽车图像。问题开始时,它再次更改为"data" = ocupado
,因为它不显示任何汽车图像。如何在javascript中正确显示和隐藏图像?
这是我对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
时,它会出现两个图像(一个在另一个的顶部)?
注意,你是隐藏的两个项目,或显示在同他们时间......不应该是每一个? –
是的,你在同一时间隐藏自由和忙碌,或同时显示它们。一个人应该永远隐藏,一个隐藏。 – mrunion