Home/ Questions/Q 9171279
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-17T16:08:28+00:00

In my jQuery mobile (v 1.2) web site, I have several separate pages (i.e.

  • 0

In my jQuery mobile (v 1.2) web site, I have several separate pages (i.e. each page has one header, content and footer). The problem is I can’t link the pages. The following line is not working.
<a href="anotherpage.html">Another Page</a> shows “Error loading page”.

If I add rel="external" to the <a> element, it works. However, it turns off the automatic loading via Ajax. But I want to use the Ajax loading as well as keep the pages separate. Just wondering whether it’s possible.

Code Page 1

<!DOCTYPE html> 
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>Single page template</title> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js">  </script>
</head> 
<body> 
    <div data-role="page">
        <div data-role="header">
            <h1>Page 1</h1>
        </div>
        <div data-role="content">   
            <a href="b.html"> click me</a>
        </div>  
        <div data-role="footer">
            <h4>Footer content</h4>
        </div>
        </div>
</body>
</html>

Code Page 2

 <!DOCTYPE html> 
 <html>
 <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>Single page template</title> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js">      </script>
 </head> 
 <body> 
     <div data-role="page">
         <div data-role="header">
             <h1>Page 2</h1>
         </div>
         <div data-role="content">  
              page 2 content
         </div> 
         <div data-role="footer">
             <h4>Footer content</h4>
         </div>
    </div>
 </body>
 </html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The problem is that you are trying to load your pages from the filesystem.
    Chrome settings prevents that, assuming that a security risk.

    Serve your pages with a web server. You can use IIS on Windows XP Pro for that.

    or

    You can start chrome with --allow-file-access-from-file command line option

    • 0