CODEWITHSUNDEEP
javascriptjqueryajaxonclickrefresh
user610572
user610572

Reputation: 1

How do i refresh a divs with oneClick on a image?

I have searched but i can't understand because no one explain. So this is what i want to do: I want to refresh divs without reloading the whole page. Like this.:

 <div id="topimage">
 <span id="happysmile"><img alt="happysmile" src="happysmile.png"></a></span>
 <span id="refreshbuttn"><img alt="refreshbuttn" src="refreshbuttn.png"></a></span>
                </div>

<div id="topDatum"><script type="text/javascript">
var mynewdate = new Date();
document.write(mynewdate.getMilliseconds());
</script></div>

So i just want to reload the "sec" div not the topimage div. with just clicking the refreshbuttn.png.

Is this possible, and how do you do it?

Thanks, and sorry for my bad english.

Upvotes: 0

Views: 2458

Answers (3)

Jan Aagaard
Jan Aagaard

Reputation: 11194

This might help you get started: http://jsbin.com/iwebo4/edit. Here is the JavaScript part:

function updateMilliseconds() {
  if (document.getElementById('hello')) {
    document.getElementById('hello').innerHTML
      = new Date().getMilliseconds();
  }
}

updateMilliseconds();​

Upvotes: 0

Scoobler
Scoobler

Reputation: 9719

If you are using jQuery you could use the following:

$("#refreshbuttn").click(function(){
    var mynewdate = new Date();
    $("#topDatum").html(mynewdate.getMilliseconds());
});

It will, listen the the object with ID refreshbuttn for clicks (in this case the object is the refreshbuttn span).
When it is it will get a new date.
Then it will set the HTML of the object with the ID topDatum to the new milliseconds (in this case the object is the topDatum DIV).

Demo here

Upvotes: 0

user113716
user113716

Reputation: 322542

If by the "sec" div you mean the "topDatum" div, you can do this:

Example: http://jsfiddle.net/YCM9m/1/

<div id="topimage">
    <span id="happysmile"><img alt="happysmile" src="happysmile.png"></span>
    <span id="refreshbuttn"><img alt="refreshbuttn" src="refreshbuttn.png"></span>
</div>

<div id="topDatum"></div>

<script type="text/javascript">
    document.getElementById('refreshbuttn').onclick = function() {
        var mynewdate = new Date();
        document.getElementById('topDatum').innerHTML = mynewdate.getMilliseconds();
    }
</script>

This uses document.getElementById to get the element with the ID refreshbuttn. It gives it an onclick handler that creates a date object, and gets the element with the ID topDatum and sets its innerHTML to the value of mynewdate.getMilliseconds().

Upvotes: 1

Related Questions