主页没有显示在谷歌铬
The home page not displayed in google chrome
我使用chrome浏览器。我使用这一行：
<td><a href = '/'; >Home</a></td>
返回主页。
例如：
如果我在地址栏中有这个URL：
http://localhost:1234/#reportPage
在我按下Home后，我在地址栏中得到了这个URL：
http://localhost:1234/
reportPage是具有数据角色="page"的div的ID。
地址栏是更改的，但视图没有更改（旧视图保持不变，HTML页面的视图没有更改）。
但如果使用FF或IE浏览器，效果会很好，当我按下Home按钮时，地址栏会更改，视图也会更改为主页。知道为什么我在谷歌chrome中的上面的代码有问题吗？
这里是我的HTML代码：
<!DOCTYPE html>
<html ng-app="muni">
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=medium-dpi" />
<title>Review</title>
<link href="css/ol.css" rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="css/themes/rtl/rtl.jquery.mobile-1.4.0.css" />
<link rel="stylesheet" type="text/css" href="css/index.css" />
<script src="scripts/libs/angular.min.js"></script>
<script src="scripts/libs/angular-touch.min.js"></script>
<script src="scripts/libs/angular-route.min.js"></script>
<script src="scripts/libs/angular-sanitize.min.js"></script>
<script type="text/javascript" src="scripts/libs/jquery-2.1.1.min.js"></script>
<script type="text/javascript">
$(document).bind("mobileinit", function () {
$.support.cors = true;
$.mobile.allowCrossDomainPages = true;
$.mobile.pushStateEnabled = false;
$.mobile.defaultPageTransition = 'slide';
$.mobile.buttonMarkup.hoverDelay = 0;
$.mobile.allowCrossDomainPages = true;
});
</script>
<script type="text/javascript" src="scripts/libs/rtl.jquery.mobile-1.4.0.js"></script>
</head>
<body ng-controller="mainController as main">
<div data-role="page" id="home">
<div data-role="header">
<h2>{{vm.config.customer.name}}</h2>
</div>
<div data-role="main" class="ui-content">
<img style="display: block; margin: 10px auto 30px auto;max-width: 90%; max-height: 90%;" ng-src="{{vm.config.customer.logo}}" alt="{{vm.config.customer.name}}" />
<div data-role="controlgroup">
<a href="#reportPage" class="ui-btn ui-corner-all ui-icon-tmblocate">Sites Mapping</a>
<a href="#messages" class="ui-btn ui-corner-all ui-icon-tmbmail">Messages</a>
<a href="#underConstruction" class="ui-btn ui-corner-all ui-icon-tmbmap">On Cnostruction</a>
<a href="#underConstruction" class="ui-btn ui-corner-all ui-icon-tmblock">Profile</a>
</div>
</div>
</div>
<div data-role="page" id="reportPage" ng-controller="reportController">
<div data-role="header">
<h2>{{vm.config.customer.name}}</h2>
</div>
<div data-role="main" class="ui-content">
<div ng-show="stage=='map'">
<div>
<table class="button-panel">
<tr>
<td><img src="images/mail-sent.png" ng-click="goNextStage()" /></td>
<td class="big" ng-style="{'background': 'url('+ report.Photo +') no-repeat center', 'background-size': '200px'}"><img src="images/photo-large.png" ng-click="takePhoto()" /></td>
<td><img src="images/home-large.png" ng-click="goPreviousStage()" /></td>
<td><a href='/#'>Home</a></td> <----this Home link!!!
</tr>
</table>
</div>
<div style="clear:both"></div>
<select id="reportType" ng-model="viewModel.reportType" ng-options="reportType.Text for reportType in reportTypes"></select>
<div id="addressForm">
<table style="width: 100%">
<tr>
<td style="width:200px">
<input ng-model="search.addressSearch" placeholder="Enter address" />
</td>
<td style="width:auto">
<button ng-click="searchForAddress()" class="ui-btn ui-btn-inline ui-btn-icon-right ui-icon-search ui-corner-all"></button>
</td>
<td style="text-align: left">
<button ng-click="gotoMyLocation()" class="ui-btn ui-btn-inline ui-corner-all ui-btn-icon-notext ui-icon-location"></button>
</td>
</tr>
</table>
</div>
<div id="map"></div>
</div>
<div ng-show="stage=='success'">
<div>
<table class="button-panel">
<tr>
<td></td>
<td class="big"><img src="images/home-large.png" ng-click="goPreviousStage()" /></td>
<td></td>
</tr>
</table>
</div>
<div class="ui-body ui-body-a ui-corner-all" style="margin: 20px 10px;">
<img src="images/success.png" style="float: right; width: 100px; margin: 5px;" />
<h3>Site saved</h3>
<p>
Saved.<br />
Number: <span id="reportId">{{reportId}}</span>
<br />
Thank you for coorparating
</p>
</div>
</div>
<div ng-show="stage=='error'"></div>
</div>
<div id="addressPanel" data-role="panel" data-position="left" data-display="overlay">
<ul data-role="listview">
<li ng-repeat="address in search.results">
<a href ng-click="setAddress(address)">{{address.formatted_address}}</a>
</li>
</ul>
</div>
</div>
<div data-role="page" id="messages" ng-controller="messagesController">
<div data-role="header">
<h2>Masseges</h2>
</div>
<div data-role="main" class="ui-content">
<div>
<table class="button-panel">
<tr>
<td></td>
<td class="big"><img src="images/home-large.png" ng-click="goBackPlease()" /></td>
<td></td>
</tr>
</table>
</div>
<ul id="messageList" data-role="listview" data-inset="true">
<li ng-repeat="message in messages | orderBy:'-Date' track by $index">
<h2>{{message.Title}}</h2>
<p ng-bind-html="message.Body | wrapphones"></p>
<p style="text-align: left">{{message.Date | date:'dd/MM/yyyy'}}</p>
</li>
</ul>
</div>
</div>
<div data-role="page" id="underConstruction">
<div data-role="header">
<h2>On construction</h2>
<a href="#" onclick="window.goBackPlease()" class="ui-btn ui-btn-inline ui-icon-back ui-btn-icon-right ui-corner-all btn-back" style="float: right !important;">Back</a>
</div>
<div data-role="main" class="ui-content">
<img style="width: 95%; display: block; margin: 10px auto;" src="images/Under-Construction.gif" alt="Under Construction" />
</div>
</div>
<div data-role="page" id="logPage">
<div data-role="header">
<h2>LOG</h2>
</div>
<div data-role="main" class="ui-content">
<ul id="log"></ul>
</div>
</div>
z
<script src="phonegap.js"></script>
<script type="text/javascript" src="scripts/libs/ol.js"></script>
<script src="scripts/index.js"></script>
<script src="scripts/app/config.js"></script>
<script src="scripts/app.js"></script>
<script src="scripts/app/filters/wrapphones.js"></script>
<script src="scripts/app/services/coordinateSerivce.js"></script>
<script src="scripts/app/services/reportService.js"></script>
<script src="scripts/app/services/mapService.js"></script>
<script src="scripts/app/services/pushService.js"></script>
<script src="scripts/app/controllers/mainController.js"></script>
<script src="scripts/app/controllers/reportController.js"></script>
<script src="scripts/app/controllers/messagesController.js"></script>
</body>
</html>
一种方法可以包括input元素作为body元素的第一个子元素，tabindex设置为1；使用history.replaceState()
<!DOCTYPE html>
<html>
<head>
<style>
#abc {
position: relative;
top: 800px;
}
</style>
<script>
function home(e) {
e.preventDefault();
history.replaceState({}, "home", location.pathname);
document.getElementById("home").focus()
}
</script>
</head>
<body>
<h1>Hello Plunker!</h1>
<input tabindex="1" type="button" id="home" style="opacity:0;width:0;height:0" />
<table>
<tbody>
<tr>
<td><a href="#abc">abc</a>
</td>
</tr>
<tr>
<td id="abc"><a href="" target="_self" onclick="home(event)">Home</a>
</td>
</tr>
</tbody>
</table>
</body>
</html>
plnkrhttp://plnkr.co/edit/sRyoc4uR2N4F8sbzD4zZ?p=preview
你基本上不会转到另一个页面，也不会重新加载它。你停留在同一个页面上，只是试图跳到顶部。#reportPage会将您带到id为reportPage的元素，删除id并不意味着"滚动到顶部"。当你似乎到达页面顶部时，只需将其更改为：
<td><a href='/#'>Home</a></td>
通过明确地将您带到顶部，它将正常工作。
如果它仍然不起作用，建议将位置设置为/，并使用javascript:重新加载页面
<td><a href='javascript:location.href="/";location.reload();'>Home</a></td>
location.reload()句子可能过多（对我来说，没有它确实有效），但正如你所说的，你在重新加载时有问题，你也可以试试这个句子。
为了确保所有内容，请在页面中添加以下JS行：
$('a[href="/"]').off();
jQuery-off移除一个事件处理程序，.of（）不带参数将移除所有附加到元素的处理程序。
你的代码会起作用的！只需使用正确的xHtml:
<td><a href="/">Home</a></td>
或者，保留在同一文件夹中
<td><a href="./">Home</a></td>
如果您有www.yoursite.com/ciao/#apagehref="./"将返回www.yoursite.com/siao/，而href="/"将返回www.oursite.com
相关文章：
- 不显示带有本地json文件数据的谷歌地图脚本
- 谷歌地图不是以HTML显示，而是在JS Fiddle上工作
- 谷歌地图标记不会显示
- 无法在JS中显示谷歌地图
- 需要帮助谷歌地图方向面板在FancyBox中显示
- 使用谷歌应用程序脚本从工作表中获取值并将其显示在文本框中
- 谷歌地图JS API+JSON-多个标记没有显示
- 如何在谷歌字体加载时显示加载图像
- 谷歌水印未显示在自定义搜索框中
- 谷歌地图v3标记没有显示ie8和9
- 标记不会显示在谷歌地图上
- 谷歌地图停止显示点v3
- 谷歌图表显示所有标签
- PHP谷歌地图-位置红色气球没有显示
- SIMPLE Javascript代码，用于显示谷歌电子表格中单个字段的数据
- 谷歌地图地点API地图未显示
- 当我使用高度百分比时，谷歌地图javascript api不会显示
- 谷歌图表在运行应用程序时只能显示一次
- 使用JSON在谷歌地图上显示标记
- 使用谷歌地图API和phonegap显示当前位置+方向
