Ajax создать новый DIV вместо обновления

У меня есть проблема с этим кодом:Ajax создать новый DIV вместо обновления

<!DOCTYPE HTML> 
<html> 
    <head> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
     <script> 

      (function update() { 
       $.ajax({ 
       type: 'GET', 
       url: "http://192.168.4.2/home/api/stato/ambiente/living", 
       dataType: "json", 
       success: renderList 
       }).then(function() {   
        setTimeout(update, 200); 
       }); 
      })();        

      function renderList(data) { 
       var list = data == null ? [] : (data instanceof Array ? data : [data]); 
       $.each(list, function(index, data) { 
        if (data.stato ==1) { 
         $('#statoList').append('<div>'+ data.ID + " " + data.descrizione + " <img src=img/lamp_on.png " + '</div>'); 
         $('#Switch').append('<button type="button">' + " OFF " + '</button>'); 
        } 
        else { 
         $('#statoList').append('<div>'+ data.ID + " " + data.descrizione + " <img src=img/lamp_off.png " + '</div>'); 
         $('#Switch').append('<button type="button">' + " ON " + '</button>'); 
        } 
       }); 
      } 
     </script> 
    </head> 
    <body> 

     <div id="statoList"></div> 
     <div id="Switch"></div> 

    </body> 

</html>

Я хочу, чтобы выполнить освежать Див каждые 200 мс, но проблема в том, что каждый раз, когда создается новый DIV ниже предыдущего ,

Как я могу это решить?

спасибо.

источник

2016-06-26 aarc

Если более чем один из каждого типа empty() контейнеры перед добавлением

$('#statoList').empty(); 
$.each(list, function(index, data) { 
     if (data.stato ==1) {...

источник

2016-06-26 15:47:32 charlietfl

Извините, но я старался, но всегда показывает только последний результат – aarc

OK ... тогда весь вопрос нуждается в уточнении. Использование append будет отображать все результаты из последнего набора данных. Если вам нужны некоторые из существующих, которые необходимо сохранить, то не ясно, как работают ваши данные. – charlietfl

Извините, это ответ GET, если он может помочь: [{«ID»: «S_I_01», «stato»: «1», «ambiente»: «living», «tipo»: «illuminazione», «descrizione»: «Illuminazione Soggiorno 1»}, {«ID»: «S_I_02», «stato»: «1», «ambiente»: «living »,« tipo »:« illuminazione »,« descrizione »:« Illuminazione Soggiorno 2 »}] – aarc

функция Append не является правильным один за то, что вы ожидаете, я предлагаю вам использовать .html(), поэтому он будет переводить весь код (новый Div) в HTML-код

function renderList(data) { 
       var list = data == null ? [] : (data instanceof Array ? data : [data]); 
       $.each(list, function(index, data) { 
        if (data.stato ==1) { 
         $('#statoList').html('<div>'+ data.ID + " " + data.descrizione + " <img src=img/lamp_on.png " + '</div>'); 
         $('#Switch').html('<button type="button">' + " OFF " + '</button>'); 
        } 
        else { 
         $('#statoList').html('<div>'+ data.ID + " " + data.descrizione + " <img src=img/lamp_off.png " + '</div>'); 
         $('#Switch').html('<button type="button">' + " ON " + '</button>'); 
        } 
       }); 
      }

источник

2016-06-26 15:32:08 PacMan

будет отображаться только последний элемент каждого типа, если массив имеет более чем один из каждого – charlietfl

Ой спасибо! Я понял! Однако, как упоминалось charlietfl, он показывает только последний результат. – aarc

Ajax создать новый DIV вместо обновления

ответ

Смежные вопросы