使用JQUERY加载动态内容

时间:2011-07-16 14:53:03

标签: jquery jquery-mobile

我正在尝试使用ajax动态加载页面。我传递了用于获取页面内容的refid。

所有信息都存储在标签的自定义属性中。有10多个链接都有自己的值。 RefID很长。不确定这是否有所作为。

<a href="#dPage" title="More Info" data-theme="c" lat="{value}" lon="{value}" refid="CnRiAAAA_wO24Cpr6mCxuLDmiXYmWB8GoC5AqCllosAfNUZbkxD3QeiLlldSgGAxiwFpIlEbMx1JxuM6J6-uvFCDA9C-NfMVxBkT438ylOSWm11b2S74qXngL-wYH29sm4KX48762VjhYov9G2oOPM_iQJRjBBIQiNyeosXXee4kwXLMYBBtChoUkQrLBokVPKDcRLehvs2PLVmDv68" id="detailslink"></a>
<div data-role="page" id="dPage">
        <div data-role="header">
            <h1>Details</h1>
        </div>
        <div data-role="content">
            <div id="detailspage">

            </div>
        </div>

    </div>

-

    $('#detailslink').live('click', function() {
        $("#detailspage").html('');
        var placelat = $(this).attr('lat'); 
    var placelon = $(this).attr('lon');
    var refid = $(this).attr('refid');
        $.ajax({  
               cache: false,
               url: "mobile/getdetails.php", 
               dataType: "html",
               data: "&lat="+placelat+"&lon="+placelon+"&refid="+refid,
               success: function (data) {   
                    alert("Success");
                    $("#detailspage").html(data);
                },
                error: function(jqXHR, textStatus, errorThrown) {
                    alert(textStatus);
                }

            });
        //alert("done");

    });

这在iPhone上无法正常工作。内容被返回并在chrome,firefox,safari,android中运行良好,但不是iphone。

iphone没有显示任何内容。它看起来确实会打电话但页面上没有任何内容。

坚持这一点。

提前致谢。

3 个答案:

答案 0 :(得分:0)

您确定在iPhone上调用了成功功能吗?试着在那里发出警报来检查?只是想知道你是否遗失了一个错误。

编辑:为通话添加错误功能。如果它失败了,你会发现原因。

jQuery Ajax() method docs

答案 1 :(得分:0)

您是否使用相对路径包含js文件? php是getdetails.php还是getDetails.php?

答案 2 :(得分:0)

我从

切换了我的包含
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a4/jquery.mobile-1.0a4.min.css" />
<script src="http://code.jquery.com/jquery-1.5.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0a4/jquery.mobile-1.0a4.min.js"></script>

<link href="http://code.jquery.com/mobile/latest/jquery.mobile.min.css" rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
<script src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js"></script>

现在它有效。