0

不久前我建立了一个 jquery 移动网站,我最近一直在扩展它并注意到性能问题。我相信这是因为我使用多页面设置构建了该站点,其中单个 php 文件包含以下页面:

ALL_PAGES.PHP

    <html>
    <head>
    /* external css and js files */
    </head>
    <body>

     <div date-role="page" id="main">
          <div class="page_link">
              page 1
          </div> 

          <div class="page_link">
              page 2
          </div> 

          <div class="page_link">
              page 3
          </div>

    </div>


    <div date-role="page" id="page 1">
          <div class="page_link">
              main
          </div>     

          <div class="page_link">
              page 2
          </div> 

          <div class="page_link">
              page 3
          </div>

    </div>

    <div date-role="page" id="page 2">

          <div class="page_link">
              main
          </div>     

          <div class="page_link">
              page 1
          </div>


          <div class="page_link">
              page 3
          </div>

    </div>

    <div date-role="page" id="page 3">

          <div class="page_link">
              main
          </div> 

          <div class="page_link">
              page 1
          </div> 

          <div class="page_link">
              page 2
          </div>


    </div>

    </body>

    </html>

我想摆脱在一个 php 文件上的这种多页设置,并转移到每个页面都是一个单独的 php 文件的设置。为了做到这一点,我从每个页面中获取 html 并将其移动到自己的 php 页面。然后我添加了 href 链接来替换我用于“page_link”类的 mobile.change() 函数。

主.PHP

 <html>
    <head>
     external css and js files
    </head>
    <body>
        <div date-role="page" id="page 1">
              <a href="/main.php">
                  main
              </a>        

              <a href="/page_2.php">
                  page 2
              </a> 

              <a href="/page_3.php">
                  page 3
              </a>

        </div>


        </body>

    </html>

PAGE_1.PHP

        <div date-role="page" id="page 1">
              <a href="/main.php">
                  main
              </a>        

              <a href="/page_2.php">
                  page 2
              </a> 

              <a href="/page_3.php">
                  page 3
              </a>

        </div>

PAGE_2.PHP

        <div date-role="page" id="page 2">
              <a href="/main.php">
                  main
              </a>            

              <a href="/page_1.php">
                  page 1
              </a> 

              <a href="/page_3.php">
                  page 3
              </a>

        </div>

PAGE_3.PHP

        <div date-role="page" id="page 3">
              <a href="/main.php">
                  main
              </a>            

              <a href="/page_1.php">
                  page 1
              </a> 

              <a href="/page_2.php">
                  page 2
              </a>

        </div>

该站点工作正常,除非用户点击浏览器中的刷新按钮。发生这种情况时,每个页面都无法访问位于主页上的任何外部 css 和 js 文件。我对 JQM 相当陌生,所以任何建议都会有所帮助。

4

1 回答 1

0

尝试这个

$("#whicheverPage").trigger("pagecreate");

加载时,它将对页面内所有添加的内容应用增强功能。

于 2013-10-22T22:01:07.250 回答