Question

我对此有点新意，如果我有点妄想，我会道歉，但我会尽力而为。

我正在尝试使用JQtouch创建一个iphone友好版本的网站。我理解通常这可以在一个HTML文件中完成，页面由DIV分隔。但是，我想从网站的exisitng页面加载内容。

该问题的下一部分是我的iphone.html页面与当前网站不在同一目录中，因此JQtouch的正常行为似乎无效。

到目前为止，我已经设置了如下页面：

<div id="home">
<div class="toolbar">

<h1>Title</h1></div>

<ul class="rounded">

<li class="arrow"> <a href="#content">HOME</a></li>

<li class="arrow"> <a href="#about">ABOUT US</a></li>

<li class="arrow"> <a href="#gnwr">GNWR</a></li>

<li class="arrow"> <a  href="#gner">GNER</a></li>

<li class="arrow"> <a href="#journal">NEWS</a></li>

<li class="arrow"> <a href="#FAQS">FAQS</a></li>                    

<li class="arrow"> <a href="#contact">CONTACT</a></li>


</ul>
</div>

<div id="content"></div>            
<div id="about"></div>
<div id="journal"></div>
<div id="faqs"></div>
<div id="contact"></div>


</body>
</html>

然后我有：

<script>
$(document).ready(function(){ 
$('#content').load('http://www.mysite.co.uk' + ' #content');
$('#about').load('http://www.mysite.co.uk/about' + ' #content'); 
                  }
</script>

这会加载我所追求的内容，并且页面动画可以正常工作。唯一的问题是我加载的内容中存在几个链接，点击它们时显然不起作用。

有没有办法可以在点击链接时查看链接的href，如果它指向www.mysite.co.uk/about更改为指向#about并强制它在那里导航？

希望如果您需要更多信息，请联系我们。

此致

克里斯。

Answer 1

你在一个问题中提出了很多问题......你应该把它们分成几个问题。人们更容易回答。无论如何，我会试一试。

首先，您不必拥有一个html中的所有内容;你可以通过AJAX加载内容。参见AJAX＆gt; this demo中的“GET示例”，以及通过AJAX加载的page content。

据我所知，您要加载的页面不必位于同一目录结构中。您想通过AJAX加载的页面需要包含一个有效的jQTouch页面，即整个页面都包含在<div>中。

有没有办法可以检查href 单击时的链接以及是否指向到www.mysite.co.uk/about改为指向#about并强制它在那里导航？

如果我理解正确，您基本上希望将所有指向www.mysite.co.uk/about的链接替换为#about。这必须使用jQuery完成：

$('a[href="http://www.mysite.co.uk/about"]').attr('href', '#about');

您可能希望在每个页面加载时执行此操作：

$(document).ready(function(e){
    $('body>div').bind('pageAnimationEnd', function(event, info){
        $('a[href="http://www.mysite.co.uk/about"]').attr('href', '#about');
    })
});

JQ Touch和AJAX

1 个答案: