2

我使用 jQuery Mobile 创建了一个 Web 应用程序,并使用 Cloudmade Leaflet 包含了一个地图。该地图具有从数据库中的坐标生成的标记。每个标记都有项目的描述和单击标记时在弹出窗口中显示的链接。一切正常。该链接访问一个 php 文件,该文件从数据库中请求有关该项目的更多信息。

我遇到的问题是,当单击弹出窗口中的链接时,而不是使用 jQuery 转换来显示包含更多信息的页面,链接会强制浏览器打开并在其中显示内容。

我认为 jQuery Mobile 看到链接并在单击它时应用 ajax 加载和转换存在一些问题。

有谁知道这是否可能以及需要做什么才能使其正常工作?

4

2 回答 2

1

巴里,

您需要做的是包含一个指向目标 jQuery 移动链接的“#”链接。例如,如果您有一个名为 infoPage 的 JQM 页面,如下所示:

<div data-role="page" id="infoPage" data-add-back-btn="true">
  <header data-role="header" data-theme="c">
    <h1>Video tests</h1>
  </header> 
  <div data-role="content">
     This is where more info would appear...
  </div>
</div>

然后你可以像这样创建标记:

var popup = new L.Popup();
popup.setLatLng( e.latlng );
popup.setContent( "More <a href='#infoPage'>info</a> here." );
map.openPopup( popup );

注意 href='#infoPage' - 这是标准 JQM 切换页面的方式。希望可以为您解决(我刚刚在这里尝试过并且有效)

...如果您将“应用程序”作为 PhoneGap 应用程序而不是纯 Web 应用程序运行,单击链接可能会导致 PhoneGap 在浏览器中启动内容,而不是停留在自己的 Web 视图中。这是在其他地方回答的:

PhoneGap 应用程序中远程 JQueryMobile 站点中的链接打开 safari

什么控制 PhoneGap 是否打开外部浏览器/Safari?

http://forum.jquery.com/topic/phonegap-jquerymobile-ajax-links-opening-in-browser-window

在 phonegap 程序中打开链接

于 2012-01-24T00:25:27.670 回答
0

我在 jQuery Mobile 中开发,默认情况下 jQuery 移动表单通过 ajax 调用服务器,您应该添加data-ajax="false"如下:

<form action="forms-sample-response.php" method="get" data-ajax="false" class="ui-body ui-body-a ui-corner-all">

完整示例:

http://jquerymobile.com/demos/1.0/docs/forms/forms-sample.html

于 2012-01-09T23:40:32.630 回答