jquery 滑动后坐标获取问题

最近写一个滑动程序，遇到一些问题，当div滑动之后坐标获取还是以前的。比如说，div1目前的left坐标为：10PX，我将它的left滑动到：20PX，滑动之后我立刻获取它此时的坐标，坐标显示仍然为10px，我很郁闷，我想获取它滑动之后的坐标，希望给个方案。如下，直接复制，可运行，点击按纽滑动。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>如何获取div滑动之后的坐标？</title>

    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
  <script type="text/javascript" src="http://www.w3cschool.cn/jquery.js"></script>
  </head>
<script type="text/javascript">
$(document).ready(function (){
// div 滑动之前，left坐标为8
//alert($("div").offset().left);
$("input").click(function (){
$("div").animate({left:"500px", top:"50px"}, 500);
// div 滑动之后，与之前获取坐标一样，仍然为8，有什么办法让它得到滑动之后的坐标？
//alert($("div").offset().left);
});
});
</script>  
  <body>
   <div style="position: relative;"> This is my HTML page.</div>
   <input type="button" value="onclick to Right"/>
  </body>
</html>

解决方案 »

  1.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>如何获取div滑动之后的坐标？</title>
        
        <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
        <meta http-equiv="description" content="this is my page">
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        
        <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
      <script type="text/javascript" src="http://www.w3cschool.cn/jquery.js"></script>
      </head>
        <script type="text/javascript">
            $(document).ready(function (){
                // div 滑动之前，left坐标为8
                //alert($("div").offset().left);
                $("input").click(function (){
                    $("div").animate({left:"500px", top:"50px"}, 500);
                    // div 滑动之后，与之前获取坐标一样，仍然为8，有什么办法让它得到滑动之后的坐标？
                    //alert($("div").offset().left);
                }); $("div").click(function(){
    alert("left:"+this.style.left);
    });
            });
        </script>  
      <body>
       <div style="position: relative;"> This is my HTML page.</div>
       <input type="button" value="onclick to Right"/>
      </body>
    </html>
      

  2.   


    大哥，感谢 你回复，但好像您未看明白我的意思。我只能点按纽，不能点DIV，意思就是是在一个方法内触发并获取前后的坐标。
      

  3.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>如何获取div滑动之后的坐标？</title>
        
        <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
        <meta http-equiv="description" content="this is my page">
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        
        <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
      <script type="text/javascript" src="http://www.w3cschool.cn/jquery.js"></script>
      </head>
        <script type="text/javascript">
            $(document).ready(function (){
                // div 滑动之前，left坐标为8
                //alert($("div").offset().left);
                $("input").click(function (){
                    $("div").animate({left:"500px", top:"50px"}, 500,function(){
    alert("left:"+this.style.left);
    });
                    // div 滑动之后，与之前获取坐标一样，仍然为8，有什么办法让它得到滑动之后的坐标？
                    //alert($("div").offset().left);
                });
            });
        </script>  
      <body>
       <div style="position: relative;"> This is my HTML page.</div>
       <input type="button" value="onclick to Right"/>
       <div id="pst"></div>
      </body>
    </html>
      

  4.   

    你的alert方法在你未改变坐标的时候就执行了，所以坐标不变。你要获得滑动后的坐标，就必须在动画方法的回调函数里面去获取。
      

  5.   

    最近太忙，未能及时采纳，不好意思。又遇见个最新问题，
    http://topic.csdn.net/u/20111202/17/a1ed20d8-d254-4da5-bf5a-b414b41cdced.html对您们二个来说太简单了。