Question

我有一个基于jQuery Mobile的网站，我试图在对话框中打开我们的服务条款。 TOS页面本身是一个完整的页面（单独的URL），当我链接到对话框引用时，它只是作为新页面打开。我的页脚是

<div data-role="footer" data-theme="<?php echo $dataTheme ?>">
<div data-role="navbar">
        <ul>
            <li><a href="/">Home</a></li>
        <li><a rel="external" href="http://www.trackmaster.com">Full Site</a></li>
        <li><a href="/tosfull.php" data-rel="dialog" data-transition="pop">Terms</a></li>
        <li><a href="https://<?php echo $_SERVER['SERVER_NAME']; ?>/cgi-bin/my_acct_entry.cgi">My Account</a></li>
    </ul>
</div>
</div>

和我的tos.php页面（为方便起见，内容被删除）

  <!DOCTYPE html>
  <html>
     <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <meta name="author" content="AXCIS Information Network">
        <title>TrackMaster Terms of Service</title>
        <link rel="stylesheet" href="http://mobiletest.trackmaster.com/styles/mobile/themes/TrackMasterMobile.min.css" />
        <link rel="stylesheet" href="http://mobiletest.trackmaster.com/styles/mobile/jquery.mobile.structure-1.2.0.min.css" />
        <script src="http://mobiletest.trackmaster.com/javascript/frameworks/jquery-current.min.js"></script>
        <link rel="stylesheet" href="http://mobiletest.trackmaster.com/styles/mobile/mobileStyle.css" />
        <!--  Make sure there is a back button on each page  -->
  <script type="text/javascript">
      $(document).bind("mobileinit", function(){
          $.mobile.ajaxEnabled = false;
          $.mobile.page.prototype.options.addBackBtn= true;
      });
  </script>

        <script src="http://mobiletest.trackmaster.com/javascript/frameworks/jquery.mobile-current.min.js"></script>
     </head>
     <body>
        <div data-role="page" data-theme="a"  id="main">
           <div data-role="header">

     <h1 class="headerLink"><a href="/"  class="headerLink"><span class="tmFirst">Track</span><span class="tmSecond">Master</span></a> </h1>
        <a href="/" data-icon="home" data-iconpos="notext">Home</a>
  </div>

           <div data-role="content" data-theme="a">
  <div data-role="content" class="informationText">
  Blah, Blah, Blah
  </div>


  </div> <!--  this one closes out the content div set in the section header template -->
  <div data-role="footer" data-theme="a">
  <div data-role="navbar">
        <ul>
           <li><a href="/">Home</a></li>
           <li><a rel="external" href="http://www.trackmaster.com">Full Site</a></li>
           <li><a href="/tosfull.php" data-rel="dialog" data-transition="pop">Terms</a></li>
           <li><a href="https://mobiletest.trackmaster.com/cgi-bin/my_acct_entry.cgi">My Account</a></li>
        </ul>
     </div>
     <h5 class="copyrightText">&copy; 2013 Axcis Information Network, Inc.</h5>
     <div class="ads">
     <script type="text/javascript"><!--
  google_ad_client = "ca-pub-7303976721498796";
  /* Mobile Bottom */
  google_ad_slot = "5684536575";
  google_ad_width = 320;
  google_ad_height = 50;
  //-->
  </script>
  <script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
  </script>

     </div>
  </div>
  </div> <!--  this one closes out the page div set in the header template -->
  </body>
  </html>

我尝试将TOS页面的数据角色更改为对话框，但这没有任何区别。我不理解对话链接的使用方式（从我认为可以通过任何URL打开一个文档，只需将链接定义为对话框）

网站本身是http://mobiletest.trackmaster.com，它是我试图作为对话框获取的页脚中的条款链接（我不想在每个页面上包含内容，只有当用户要求时）

任何帮助表示赞赏（甚至指出我所缺少的愚蠢事物）

Answer 1

您要么错过了<div>，要么他们不匹配;你有两个“内容”div。

编辑：将一个放在另一个中可能没问题，只是注意到<div data-role="page">永远不会关闭。不知道这是否有所不同。

Answer 2

发现了这个问题。标题中的行 $ .mobile.ajaxEnabled = false; 我对它进行了评论，对话框链接按预期工作。

是问题，我正在测试它，看看当我把它拉出来时还有什么东西会被打破:-)。 TOS页面的数据角色与加载它时无关，因为对话框会自动分配对话框数据角色

jQuery移动对话框无法使用新页面

2 个答案: