jQuery Mobile中的动态链接丢失格式

在尝试和抛弃jQTouch之后，我正在尝试将jquerymobile用于一个移动网站，我认为这将非常有效。但是，我在超链接到第二个页面时遇到了格式问题

我有一个main index.php页面，其中包含我想要显示的所有静态信息。我将有两个链接，它们将对数据库中的信息进行SQL调用——对于这些链接，我将从index.php中取出代码，并调用一个单独的页面：ucd.php。第二个页面加载一个动态列表，该列表深入到数据库中，直到他们选择要寻找的汽车。我的问题是，当您从索引页面链接到ucd.php时，页面的CSS格式就消失了。如果我自己加载ucd.php，它的格式会正确。如果我转到index->ucd.php->list selection，则索引已格式化，ucd.php未格式化，第一个动态列表选项已格式化

我注意到的一件事是，当调用ucd.php时，它会将地址栏中的URL更改为http://localhost/ucd.php -不是http://localhost/ucd.php. 从我在jQuery移动站点上读到的内容来看，它这样做是为了将历史正确地保存在散列中。这是否会导致格式问题

由于空间原因，所有页面都以w/开头，并完成了适当的脚本加载。jQuery Touch 1.0a2、jQuery 1.4.4

index.php:
<div id="mainpage" data-role="page" data-theme="a">
 <div data-role="header" data-theme="a">
  <h1>Car Dealership</h1>
 </div><!-- header --> 
 <div data-role="content">
  <ul data-role="listview" data-inset="true" data-theme="a" data-dividertheme="a">
   <li><a href="ncd.php" data-transition="slide">Search New Cars</a></li>
   <li><a href="ucd.php" data-transition="slide">Search Used Cars</a></li>
   <li><a href="#service" data-transition="slide">Service/Parts Info</a></li>
   <li><a href="#location" data-transition="slide">Find Us</a></li>
   <li><a href="tel:8888675309" data-transition="slide">Call Us @ 888-867-5309</a></li>
   <li><a href="#hours" data-transition="slide">Hours of Operation</a></li>
  </ul>
 </div><!-- content -->
 <div data-role="footer" data-theme="a">
  <h4>Thanks for visiting us!</h4>
 </div><!-- footer -->
</div>

我只是粘贴从.php页面输出的HTML代码

ucd.php:
<div id="ucdmain" data-role="page" data-theme="a">
<div data-role="header" data-theme="a">
 <h1>Used Cars</h1>
</div><!-- header --> 
<div data-role="content">
 <ul data-role="listview" data-inset="true" data-theme="a" data-dividertheme="a">
<li><a href="ucd.php?ucd=make&make=Chevrolet" data-transition="slide">Chevrolet</a></li>
<li><a href="ucd.php?ucd=make&make=Chrysler" data-transition="slide">Chrysler</a></li>
<li><a href="ucd.php?ucd=make&make=Dodge" data-transition="slide">Dodge</a></li>
<li><a href="ucd.php?ucd=make&make=Ford" data-transition="slide">Ford</a></li>
<li><a href="ucd.php?ucd=make&make=GMC" data-transition="slide">GMC</a></li>
<li><a href="ucd.php?ucd=make&make=Honda" data-transition="slide">Honda</a></li>
<li><a href="ucd.php?ucd=make&make=Hyundai" data-transition="slide">Hyundai</a></li>
<li><a href="ucd.php?ucd=make&make=Infiniti" data-transition="slide">Infiniti</a></li>
<li><a href="ucd.php?ucd=make&make=Jeep" data-transition="slide">Jeep</a></li>
<li><a href="ucd.php?ucd=make&make=Lincoln" data-transition="slide">Lincoln</a></li>
<li><a href="ucd.php?ucd=make&make=Nissan" data-transition="slide">Nissan</a></li>
<li><a href="ucd.php?ucd=make&make=Toyota" data-transition="slide">Toyota</a></li>
<li><a href="ucd.php?ucd=make&make=Volkswagen" data-transition="slide">Volkswagen</a></li>
 </ul>
</div><!-- content -->
<div data-role="footer" data-theme="a">
 <h4>Thanks!</h4>
</div><!-- footer -->

提前感谢您的帮助， Josh Hogan

假设您很好地定义了标记，并且正确地使用了JQM，那么这可能是我在JQM alpha2和jquery 1.4.4中多次看到的问题。 用jQuery1.4.3试试看它是否开始工作

另外，今天发布了JQM alpha3，JQuery1.5预发布版已经发布。尝试升级。

假设您很好地定义了标记，并且正确地使用了JQM，这可能是我在JQM alpha2和jquery 1.4.4中多次看到的问题。 用jQuery1.4.3试试看它是否开始工作

---

另外，今天发布了JQM alpha3，JQuery1.5预发布版已经发布。尝试升级。

通过手动绑定，我可以在alpha3中找到解决方法

首先关闭自动初始化

$(document).bind("mobileinit", function () {
    $.extend($.mobile, {
        autoInitialize: false
    });
});

然后在动态构建页面之后，手动初始化jquery mobile

$(function () {
    yourdynamicfunction();
    $.mobile.initializePage();
});

---

通过手动绑定，我可以在alpha3中找到解决方法

首先关闭自动初始化

$(document).bind("mobileinit", function () {
    $.extend($.mobile, {
        autoInitialize: false
    });
});

然后在动态构建页面之后，手动初始化jquery mobile

$(function () {
    yourdynamicfunction();
    $.mobile.initializePage();
});

---

这证实了我所担心的——只是alpha版本中的一个bug。谢谢你的回答！这证实了我所担心的——只是alpha版本中的一个bug。谢谢你的回答！如果你正在进行异步调用或回调，则需要在所有调用结束时触发。如果你需要停止自动初始化以使应用程序正常工作，那么我想你应该重新设计你的工作方式……哦，别担心，在下一个alpha版本中，他们已经改变了这一切的工作方式。。alpha肯定还是有问题的。如果你在进行异步调用或回调，需要在所有调用结束时触发。如果你需要停止自动初始化以使应用程序工作，那么我想你应该重新设计你的工作方式……哦，别担心，他们已经在下一个alpha版本中改变了这一切的工作方式。。阿尔法一家肯定还开着马车。