hide/show dynamique basé sur ajax

Question

J'ai actuellement un tableau dynamique d'adresses IP et je veux afficher (si ip est actif) et masquer (si l'ip est inactive). J'ai implémenté la solution ci-dessous mais je me demande s'il y a un meilleur moyen ..

fichier de données est au format JSON et est mis à jour chaque seconde, j'utilise jquery pour obtenir le contenu du fichier JSON et basé sur les valeurs i veulent afficher/cacher l'adresse IP et les noms de périphériques correspondants (stockés dans le tableau IP_Address)

var IP_Address = new Array(); 
for (i=0;i<70;i++){ IP_Address["10.1.1."+i]="other-devices";} 
IP_Address["10.1.1.1"]="known-device-1"; 
IP_Address["10.1.1.16"]="known-device-2"; 
IP_Address["10.1.1.37"]="known-device-3"; 
IP_Address["10.1.1.38"]="known-device-4"; 
IP_Address["10.1.1.45"]="known-device-5"; 
IP_Address["10.1.1.46"]="known-device-6"; 
IP_Address["10.1.1.47"]="known-device-7"; 
IP_Address["10.1.1.49"]="known-device-8"; 
IP_Address["blank"]=""; 

données JSON sont stockées dans un tableau (données) et les valeurs peuvent être évaluées comme ci-dessous

for(var i=0;i<count;i++){ 
    if(data[i].dl>0){ 
     $("#jq"+i).html(IP_Address[data[i].ip]);} 
    else if(data[i].dl ==0){ 
     $("#jq"+i).html(IP_Address["blank"]);} 
} 

dans la section html ...

<span id="jq1"></span> 
<span id="jq2"></span> 
<span id="jq3"></span> 
<span id="jq4"></span> 
<span id="jq5"></span> 
<span id="jq6"></span> 
<span id="jq7"></span> 
<span id="jq8"></span> 
<span id="jq9"></span> 
<span id="jq10"></span> 
<span id="jq11"></span> 
<span id="jq12"></span> 
<span id="jq13"></span> 
<span id="jq14"></span> 
<span id="jq15"></span> 
<span id="jq16"></span> 
<span id="jq17"></span> 
<span id="jq18"></span> 
<span id="jq19"></span> 
<span id="jq20"></span> 

Answer 1

Peut-être que cela devrait vous aider à

<script src="jquery.js"></script> 
<script> 
$(function() { 
    setInterval(  
     function(){     

     var arr = new Array(); 

     for(var i=1;i<=5; i++){ 
      arr.push(Math.floor(Math.random()*20)); 
     }   

     $('.sh').each(function(){ 
      if(arr.indexOf(Math.floor($(this).attr('id').replace('jq', ''))) > -1){ 
       $(this).show(); 
      } 
      else{       
       $(this).hide(); 
      } 
     }) 
    }, 2000); 
}) 

</script> 
<span id="jq1" class="sh">1</span> 
<span id="jq2" class="sh">2</span> 
<span id="jq3" class="sh">3</span> 
<span id="jq4" class="sh">4</span> 
<span id="jq5" class="sh">5</span> 
<span id="jq6" class="sh">6</span> 
<span id="jq7" class="sh">7</span> 
<span id="jq8" class="sh">8</span> 
<span id="jq9" class="sh">9</span> 
<span id="jq10" class="sh">10</span> 
<span id="jq11" class="sh">11</span> 
<span id="jq12" class="sh">12</span> 
<span id="jq13" class="sh">13</span> 
<span id="jq14" class="sh">14</span> 
<span id="jq15" class="sh">15</span> 
<span id="jq16" class="sh">16</span> 
<span id="jq17" class="sh">17</span> 
<span id="jq18" class="sh">18</span> 
<span id="jq19" class="sh">19</span> 
<span id="jq20" class="sh">20</span> 

Sur JSFIDDLE.

PS :: Si quelqu'un sait comment vérifier une valeur dans un tableau, alors s'il vous plaît, aidez-moi à améliorer ma réponse.