data-title
属性
使用
jquerymobile
的时候有时候我们会在同一个页面中写多个页面，但是在切换的时候，在浏览器显示的
title
总是同一个。我们需要不同的页面显示不同的
title
，这时候我们可以在
data-role
后面添加
data-title
属性
，设置自己需要的
title
内容
。
1.
<!DOCTYPE html
>
2.
<html>
3.
<head>
4.
<meta
name
=
“viewport”
content
=
“width=device-width, initial-scale=1”
>
5.
<title>
Multi Page Example (2)
</title>
6.
<link
rel
=
“stylesheet”
href
=
“http://code.jquery.com/mobile/latest/jquery.mobile.min.css”
/>
7.
<script
src
=
“http://code.jquery.com/jquery-1.7.1.min.js”
></script>
8.
<script
src
=
“http://code.jquery.com/mobile/latest/jquery.mobile.min.js”
></script>
9.
</head>
10.
11.
<body>
12.
- <div data-role=”page” id=”homePage”>
-
<div
data-role
=
“header”
>
Welcome
</div>
-
<div
data-role
=
“content”
>
-
<p>
-
Welcome to our first mobile web site. It’s going to be the best site you’ve ever seen.
-
Once we get some content. And a business plan. But the hard part is done!
-
</p>
-
<p>
-
You can also
<a
href
=
“#aboutPage”
>
learn more
</a>
about Megacorp.
-
</p>
-
</div>
-
-
<div
data-role
=
“footer”
>
-
<i>
Copyright Megacorp © 2012
</i>
-
</div>
-
</div>
-
-
<div data-role=”page” id=”aboutPage” data-title=”About Megacorp”>
-
<div
data-role
=
“header”
>
About Megacorp
</div>
-
<div
data-role
=
“content”
>
-
<p>
-
This text talks about Megacorp and how interesting it is. Most likely though you want to
-
<a
href
=
“#homePage”
>
return
</a>
to the home page.
-
</p>
-
</div>
-
<div
data-role
=
“footer”
>
-
<i>
Copyright Megacorp © 2012
</i>
-
</div>
-
-
</div>
-
</body>
-
</html>
在我们点击
learn more
链接后，跳转了一个页面，同时
title
会改变为
About Megacorp
。