2014-02-12 11 views
2

我使用jQuery移动1.4.0运行,当我创建像
page1.html
page2.html
第一加载某些文件是page1.htmlexample/page1.html,当我点击在第1页一些链接,然后page2.html加载像example/page2.html脚本和样式的标题不是第二个文件

但是脚本和样式在第2页未运行,它只是如果我直接访问网址运行(或刷新)

我发现了2路像
- 把所有的脚本/风格文件,并呼吁他们在第一页和其他页面
- 把自定义的脚本div标签内的自定义页面

什么是我能做到的最好方法是什么?谢谢。

更新

我提出例如像

enter image description here
page1.html

<!DOCTYPE html> 
<html> 
<head> 
    <title>Page Title</title> 

    <meta name="viewport" content="width=device-width, initial-scale=1"> 

    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.css" /> 
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
    <script src="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.js"></script> 
</head> 
<body> 

<div data-role="page"> 

    <div data-role="header"> 
     <h1>Page Title</h1> 
    </div><!-- /header --> 

    <div role="main" class="ui-content"> 
     <ul data-role="listview" data-inset="true" data-divider-theme="a"> 
      <li data-role="list-divider">Page1</li> 
      <li><a href="page2.html">Page2</a></li> 
      <li><a href="#">test</a></li> 
      <li data-role="list-divider">test</li> 
      <li><a href="#">test</a></li> 
      <li><a href="#">test</a></li> 
     </ul> 
    </div><!-- /content --> 

    <div data-role="footer"> 
     <h4>Page Footer</h4> 
    </div><!-- /footer --> 
</div><!-- /page --> 

</body> 
</html> 

page2.html

enter image description here

<!DOCTYPE html> 
<html> 
<head> 
    <title>Page Title</title> 

    <meta name="viewport" content="width=device-width, initial-scale=1"> 

    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.css" /> 
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
    <script src="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.js"></script> 
    <style> 
     /*not running except access directly this page or refresh*/ 
     .ui-listview{ 
      margin-top: 0px !important; 
     } 
    </style> 
    <script> 
    $(function(){ 
     $('#myclick').on("touchstart click", function(){ 
      alert('not running except access directly this page or refresh'); 
     }); 
    }); 
    </script> 
</head> 
<body> 

<div data-role="page"> 

    <div data-role="header"> 
     <h1>Page Title</h1> 
    </div><!-- /header --> 

    <div role="main" class="ui-content"> 
     <ul data-role="listview" data-inset="true" data-divider-theme="a"> 
      <li data-role="list-divider">Page2</li> 
      <li><a href="#" id = "myclick">Page1</a></li> 
     </ul> 
    </div><!-- /content --> 

    <div data-role="footer"> 
     <h4>Page Footer</h4> 
    </div><!-- /footer --> 
</div><!-- /page --> 

</body> 
</html> 
+0

向我们显示代码。我们不是美国国家安全局。 –

+0

你如何导航到其他页面?请发布您的标记/代码。 – Omar

+0

@ SverriM.Olsen和Omar请参阅我的更新 – freestyle

回答

0

确实,最好的做法是在单独的文件文件中加载HTML结构的顶端。从doctype开始,大部分结束文件或者在文件中开始标记。

该文件可以在所有其他页面上调用,添加脚本或样式表只需要编辑一个文件。

+0

请看我的更新代码 – freestyle

相关问题