如何使用jquery mobile/Jquery查找元素的座標或位置？

我正在使用的代碼是針對移動應用程序的。我想在手機屏幕上找到當前選定對象的位置>在這裏，我有兩個段落元素ID「#first」和「#second」，我試圖找到它的位置。但它總是返回我HTML coords (0,0)的結果。我想這是因爲我使用jQuery的功能.postion（），而不是jQuery的移動功能。請幫助如何使用jquery mobile/Jquery查找元素的座標或位置？

<html> 
    <head> 
    <meta name="viewport" content="width=320; user-scalable=no" /> 

    <link rel="stylesheet" href="master.css" type="text/css" media="screen" title="no title"> 

    <script type="text/javascript" charset="utf-8" src="main.js"></script> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0-rc.2/jquery.mobile-1.1.0-rc.2.min.css" /> 
    <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 
    <script src="http://code.jquery.com/mobile/1.1.0-rc.2/jquery.mobile-1.1.0-rc.2.min.js"></script> 

    <script> 
    $("*", document.body).click(function (e) { 
    var offset = $(this).position(); 
    e.stopPropagation(); 
    $("#result").text(this.tagName + " coords (" + offset.left + ", " + 
            offset.top + ")"); 
    }); 

    </script> 

</head> 
<body> 

<div data-role="page"> 

    <div data-role="header"> 
     <h1>My Title</h1> 
    </div><!-- /header --> 
    <div data-role="content" id="objects"> 
     <p id="first">1st object</p> 
     <p id="second">2nd object</p> 
     <p id="result"></p> 
    </div> 


</div><!-- /page --> 

</body> 
</html>

來源

2012-04-06 Anshul

你有沒有嘗試過這樣的：

$(function() { 
    $('#first,#second').click(function() { 
     $("#result").text(this.tagName + " coords (" + $(this).position().left + ", " + $(this).position().top + ")"); 
    });   
});

演示：http://jsfiddle.net/CKG9U/

來源

2012-04-06 07:08:53 codef0rmer

不是在移動工作對我來說......這不是能找到座標，並沒有任何提高exception.result容器保持爲空 – Anshul 2012-04-06 07:21:28

jsfiddle示例在Android Phone HTC Evo中的PhoneGap包裝器上正常運行 – 2012-04-06 17:51:57

如何使用jquery mobile/Jquery查找元素的座標或位置？

回答

相關問題