如何使用图片上的oneClick刷新div?

时间:2011-02-10 19:28:12

标签: javascript jquery ajax onclick refresh

我搜索过但我无法理解,因为没有人解释。 所以这就是我想要做的:我想刷新div而不重新加载整个页面。像这样。:

 <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>

所以我只想重新加载“sec”div而不是topimage div。只需点击refreshbuttn.png。

这可能,你怎么做?

谢谢,抱歉我的英语不好。

3 个答案:

答案 0 :(得分:1)

如果用“sec”div表示“topDatum”div,你可以这样做:

示例: 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>

这使用document.getElementById来获取ID为refreshbuttn的元素。它为它提供了一个onclick处理程序,用于创建日期对象,并获取ID为topDatum的元素,并将其innerHTML设置为mynewdate.getMilliseconds()的值。

答案 1 :(得分:0)

如果 使用jQuery,您可以使用以下内容:

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

它将使用 ID refreshbuttn收听点击的对象(在这种情况下,对象是刷新按钮)
什么时候会有新的约会 然后,它会将 ID topDatum的对象的 HTML 设置为新的毫秒(在这种情况下,对象是topDatum DIV)< / em>的

<强> Demo here

答案 2 :(得分:0)

这可能有助于您入门:http://jsbin.com/iwebo4/edit。这是JavaScript部分:

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

updateMilliseconds();​