Wie man mehrere div alle 5 Sekunden ändert

Question

Ich habe versucht, meine Beiträge alle 5 Sekunden zu aktualisieren, wie die Zeit aktualisiert wird, wie viele Benutzer kommentiert und wie viele Likes. Dies ist der Code habe ich versucht, so weit Einige text1

<div id='poster' class='1'> 
<input type='hidden' value='1' id='post_id'> 
Some text1 
</div> 

<div id='poster' class='2'> 
<input type='hidden' value='2' id='post_id'> 
Some text2 
</div> 

<div id='poster' class='3'> 
<input type='hidden' value='3' id='post_id'> 
Some text3 
</div> 

<div id='poster' class='4'> 
<input type='hidden' value='4' id='post_id'> 
Some text4 
</div> 

im Körper dort onload wird = 'refresh()' hier ist das, was in meinem java.js ist:

function refresh(){ 
var post_id = $("#post_id").val(); 
setTimeout(refresh_post(post_id),5000); 
} 

function refresh_post(post_id){ 
    $("."+post_id+"").load("post.php?post_id="+post_id); 
} 

aber es aktualisiert nur das erste Div der Rest bleibt der gleiche

Answer 1

Verwendung abgerufen werden können unter Verwendung von setinterval, wenn du den Beitrag am Vorabend aktualisieren willst 5 Sekunden ununterbrochen.

setInterval(function(){ 
$('input:hidden').each(function() { 
var post_id = $(this).attr('id'); 
refresh_post(post_id) 
}); 
}, 5000); 

Answer 2

Sie müssen die Funktion oder ihre Referenz übergeben, die aufausgeführt werden müssen Auch

Sie brauchen WindowTimers.setInterval()

function refresh(){ 
    var post_id = $("#post_id").val(); 
    setInterval(function(){ 
     refresh_post(post_id) 
    },5000); 
} 

Identifiers in HTML muss eindeutig sein. Sie können stattdessen die Conman-Klasse und die Verwendung class selector zuweisen. Sie können speichern die post_id in benutzerdefinierten data-* dh Daten-ID Attribute, die Element.dataset Eigenschaft oder jQuery .data(key)

HTML

<div class='poster' data-id="1"> 
<input type='hidden' value='1'> 
Some text1 
</div> 

<div class='poster' data-id="2"> 
<input type='hidden' value='2' > 
Some text2 
</div> 

<div class='poster' data-id="3"> 
<input type='hidden' value='3'> 
Some text3 
</div> 

<div class='poster' data-id=""> 
<input type='hidden' value='4'> 
Some text4 
</div> 

Script

function refresh(){ 
    $('.poster').each(function(){ 
     var post_id = this.dataset.id; // $("#post_id", this).val(); 
     var self = _this; 
     setInterval(function(){ 
      $(self).load("post.php?post_id="+post_id); 
     },5000); 
    }); 
} 

Answer 3

Method getElementsByClassName() gibt einen Satz von DOM-Elemente, die einen bestimmten Klassennamen aufweisen.

setInterval(function(){ 

var elements = document.getElementsByClassName("poster"); 
for (var i = 0, len = elements.length; i < len; i++) { 
    var post_id = elements[i].id; 
    refresh_post(post_id) 
} 

}, 5000); 

Answer 4

versuchen, diese

old_html ist div id, die Sie wollen dynamische Last ist.

newContent geting dynamisches div von einer anderen Seite.

<script> 

    setInterval(function() { 
     $('div#old_html').load('http://<?php echo $_SERVER['HTTP_HOST'] ?>/pbartest.php #newContent'); 
    }, 5000); </script>