Why won't my HTML links work in PhoneGap/Eclipse?
I created an app in HTML/CSS. It works fine in the iPhone. Now I'm porting it to Android using PhoneGap in Eclipse. I have used this page to get my starting point: phonegap / phonegap-android-eclipse-quickstart When I follow that tutorial and open it in my eLocity, it starts up correctly, opening the index.html as the home page.
My new index.html page, which replaces the one used in tutorial above, is full of normal HTML <a href="1000.html">
links within <li></li>
lists which take you to HTML pages elsewhere in the same folder (www) or the next folder (Chapters/1000.html). But when I start it up in my eLocity tablet, the links won't fire. The <li>
area just turns blue as they should, but the pages don't change开发者_开发技巧.
Why would an ordinary HTML link not work? I'm not getting any error messages in Eclipse.
Here's the beginning of index.html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<!-- <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> -->
<html>
<head>
<meta content="yes" name="apple-mobile-web-app-capable">
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<meta content="minimum-scale=1.0, width=device-width, user-scalable=no" name="viewport">
<link href="Chapters/hymns-style.css" rel="stylesheet" type="text/css">
<link href="Chapters/style.css" rel="stylesheet" type="text/css">
<title>Husting Pocket Hymnal</title>
</head>
<body style="background-color:#00aaff">
<script type="text/javascript" charset="utf-8" src="phonegap.js"></script>
<!-- <script type="text/javascript" charset="utf-8">
document.addEventListener("deviceready", function() {
alert('initialized');
}, true);
</script>
-->
<div id="content">
<span class="graytitle">Husting Pocket Hymnal</span>
<ul class="pageitem">
<li class="menu">
<span class="name"><a href="Chapters/hymns-a.html">Hymns A</a></span>
</li>
<li class="menu">
<span class="name"><a href="Chapters/hymns-b.html">Hymns B</a></span>
</li>
Here's the beginning of a page it goes to. ** All of these HTML links work: **
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta content="yes" name="apple-mobile-web-app-capable">
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<meta content="minimum-scale=1.0, width=device-width, maximum-scale=0.6667, user-scalable=no" name="viewport">
<link href="hymns-style.css" rel="stylesheet" type="text/css">
<link href="style.css" rel="stylesheet" type="text/css">
<title>Hymns A</title>
</head>
<body>
<div id="content">
<span class="graytitle">Hymns A</span>
<br>
<ul class="pageitem">
<li class="menu">
<span class="name"><a href="0300.html">
A debtor to mercy alone
<span class="detailbutton"></span></span></a>
</li>
<li class="menu">
<span class="name"><a href="0301.html">
A lamp in the night, a song in time of sorrow
<span class="detailbutton"></span></span></a>
</li>
Try <a href="file:///android_asset/www/0300.html">...</a>
If that works then it could be a bug / edge case with how the URL handling works at this line: https://github.com/phonegap/phonegap-android/blob/master/framework/src/com/phonegap/DroidGap.java#L1028
I found the problem. I can tap on the text and go to the link, but tapping elsewhere on the cell did not work. This is because I had removed the arrow png that belongs at the far right. If the a href tag enclosed the text and that arrow, then the link worked across the entire cell.
精彩评论