Jquery 标题中的脚本和样式未在第二个文件中运行
我使用jquerymobile1.4.0创建了一些文件,比如 页面1.html 页面2.html 第一个加载的是page1.html,比如example/page1.html,当我单击page1中的某个链接时,page2.html就会像example/page2.html一样加载Jquery 标题中的脚本和样式未在第二个文件中运行,jquery,jquery-mobile,Jquery,Jquery Mobile,我使用jquerymobile1.4.0创建了一些文件,比如 页面1.html 页面2.html 第一个加载的是page1.html,比如example/page1.html,当我单击page1中的某个链接时,page2.html就会像example/page2.html一样加载 <!DOCTYPE html> <html> <head> <title>Page Title</title> <meta name=
<!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>
但page2中的脚本和样式并没有运行,只有在我直接访问url或刷新时才会运行
我找到了两条路
-将所有脚本/样式放在文件中,并在第一页和其他页中调用它们
-将自定义脚本放在自定义页面的div标记内
我能做的最好的方法是什么?谢谢
使现代化
我做了这样的榜样
页面1.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>
页面2.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>
<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>
实际上,最好的做法是使用一个单独的文件,在其中加载HTML结构的顶部。从doctype开始,主要以文件中的标记或开始标记结束文件
可以在所有其他页面上调用此文件,添加脚本或样式表只需要编辑一个文件 给我们看看代码。我们不是国家安全局。你如何导航到其他页面?请发布您的标记/code.@SverriM.Olsen和Omar请查看我的updateplace JS在page2.html内的data role=page div。