2
I wonder if there is a way to update only one div automatically at each x seconds without having to update the entire page this would be possible?
3 answers
1
There are many frameworks and libraries that can help you manipulate GIFT, such as: Jquery, Angularjs, Emberjs, Reactjs, etc. I won’t go into detail about them, but basically you can add specific event listeners to elements you want to manipulate. Here is an example of how to change the text of a div by adding a listener to the click. How to update each X time, you can use the function setInterval, you can see more details about her on documentation. I hope I’ve helped. :)
<div id="myId">Original</div>
<script>
var div = document.getElementById("myId");
// Adicionando ouvinte de clique
div.addEventListener("click", function (event) {
div.innerHTML = "Alterado =)";
});
// Criando um intervalo
var interval = setInterval(function () {
var date = new Date();
div.innerHTML = date.toLocaleTimeString();
if (date.getSeconds() % 5 == 0) {
div.innerHTML = "Intervalo cancelado :)";
clearInterval(interval);
}
}, 1000/* 1s */);
</script>
-
I guess he doesn’t want to keep clicking the parade... He wants it to be automatic...
-
That bro thanks !
1
Update a div automatically every 3 seconds using HTML and JavaScript without updating the whole page:
$(function() {
setTime();
function setTime() {
var date = new Date().getTime();
var string = "Timestamp: "+date;
setTimeout(setTime, 3000);
$('#setTime').html(string);
}
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="setTime"></div>-
I would like to edit , and change as I put the text between the example tags <div id="setTime"> here I edited</div>
-
Brother, if you decide... It’s automatic or not?
-
Automatically
-
No more inside the javascritp I’ll switch between the div
-
1
But
$('#setTime').html(string);is altering the content of<div>. There is nothing being changed in javascript... -
I wanted to type so <div id="setTime"> original</div> on the screen original word then I will change <div id="setTime"> I changed </div> and change on the screen to the word changed understood
-
For the record, if you need to type, then is not automatic, and it cannot be "every x seconds" as you asked. Edit, or ask another question ;)
-
Let’s go continue this discussion in chat.
-
You can join the chat ?
-
<meta http-equiv="refresh" content="5" > Type this plus only in a div
0
I set a very simple example, you click on div and it changes.
In a more real case you should call via ajax a backend and this return you the content, I hope to have helped.
<body>
<div id=teste onclick="changeMe()"> meu texto original </div>
<div id="meuReload" style="border: solid 1px">
3
</div>
<script>
function changeMe(){
document.getElementById("teste").innerHTML = "alterei a div";
n=0;
setInterval(function(){
n=n+1;
document.getElementById("meuReload").innerHTML = "alterando a outra div"+n; }, 2000);
}
</script>
</body>
Abs
-
HI bro edited the question had interpreted the wrong vcs actually would it automatically one (auto refresh in div every x seconds)
-
I changed to what you asked just use setInterval() the rest is just demo.
-
I tested bro nothing excuse no manjo anything javascritp I know basics of the basics
-
Did you even test by clicking on the testo "my original text"? Every 2 seconds is to change the lower div.
Browser other questions tagged javascript jquery html
You are not signed in. Login or sign up in order to post.
Voce says... as if it were a chat? Or update in what sense?
– LocalHost
It’s like a chat room
– Hemerson Prestes
I got it. There are several ways to do it, some demanding more from the server others not. I’m running out of time now, but if I don’t paint any answers there. I answer
– LocalHost
That there heals with
Websocket.– ShutUpMagda
I believe that there are already several answers to this, just see which one adapts best http://answall.com/search?q=qupdate+sem+refresh
– Guilherme Nascimento
You are using PHP, Rubyonrails, Node.js or Asp.net?
– Guilherme Nascimento
I am using PHP
– Hemerson Prestes
If the answer I have marked as dup does not resolve try these answers http://answall.com/search?q=r+sem+refresh+%5Bphp%5D most is equal to your problem.
– Guilherme Nascimento
<meta http-equiv="refresh" content="5" > Type this only in a div on the same page
– Hemerson Prestes
@Hemersonprestes can’t say what he wants. Bro,
<meta http-equiv="refresh" content="5" >will reload all the bagasse. Can’t use it the way you ask in the question. If you want thisdivchange when typing text or clicking something (event), then your question is duplicated and has to be closed.– ShutUpMagda
Example I am open page with dreamwaver open, when changing the text in div by dreamwaver changes the text on the browser screen only, changes the text of that div I am changing by dreamwaver
– Hemerson Prestes
@Hemersonprestes not only ajax solves (or anything that does the process in the background, but is more complex than ajax, so ajax is the easiest way to just study).
– Guilherme Nascimento
@Hemersonprestes Dreamwaver is an editor, you have to learn what front-end, back-end and preferably understand what HTTP is. Not knowing HTTP technically you don’t know what website is.
– Guilherme Nascimento
Is he talking about creating a browser module (extension) that monitors the source files in a development environment and, when they are modified/savos, the browser updates only the modified element, without having to refresh the whole page (type webpack hot module Replacement)? Or at least an automatic refresh, so the developer doesn’t keep giving F5.
– mrlew
@mrlew ae would be reason for closure "is not clear".
– Guilherme Nascimento