我在 StackOverflow 上进行了搜索，并看到了有关如何执行此操作的各种主题，但没有任何内容与我的特定情况真正相关。我正在（为一个班级）编写一个移动“应用程序”（使用 HTML5、CSS、jQuery）。它将最终成为一个独立的“应用程序”，其中包含所有需要文件的本地副本。在我的一个页面上，我有一个提交表单，并且由于用户在离线时无法提交表单，因此我希望将页面重定向到自定义 404 页面。
我只是想看看是否有办法在 jQuery 中实现这一点，因为我还没有真正找到任何东西。
谢谢
【问题讨论】：
你可以使用
if (navigator.onLine) {
// I'm online so submit the form.
}
【讨论】：
Offline 模式，我正在寻找一种方法来实际检查您是否可以访问互联网。
您实际上根本不需要 jQuery。 HTML5 本身为在线/离线条件下运行的应用程序提供了一个简洁的工具 - cache manifest。缓存清单是在<html> 标签的manifest 属性中引用的纯文本文件：
<html manifest="cache.manifest">
这个清单文件的内容告诉浏览器，哪些资源需要在线条件才能运行（NETWORK），哪些文件需要缓存（CACHE）以及离线请求网络资源时该怎么做（FALLBACK )。
CACHE MANIFEST
# the above line is required
NETWORK:
*
FALLBACK:
* error404.html
CACHE:
index.html
about.html
help.html
# Plus all other resources required to make it look nice
style/default.css
images/logo.png
images/backgound.png
当使用manifest时，浏览器会先查询manifest，无需任何脚本，根据在线或离线进行相应的操作。
http://dev.w3.org/html5/spec-preview/offline.html#manifests
更新：
请注意响应内容类型的关键要求。纯文本根本行不通。
清单必须使用
text/cache-manifestMIME 类型提供。
http://dev.w3.org/html5/spec-preview/offline.html#writing-cache-manifests
另外请注意，清单中未列出的所有 URL 都会因此被阻止加载。这就是为什么我使用通配符 (*) 修复了上述清单以允许“其余部分”。这可能会帮助您入门。
【讨论】：
您可以检查navigator.onLine 属性或监听offline/online 事件：
$(document).on('offline online', function (event) {
alert('You are ' + event.type + '!');
});
来源：http://www.html5rocks.com/en/mobile/workingoffthegrid/
以下是这些事件的一些 MDN 文档：https://developer.mozilla.org/en/Online_and_offline_events
我自己对这些事件并不熟悉，但是如果您阅读上面的链接，您应该会发现很多很好的信息。
【讨论】：
navigator.onLine的MDN网站链接：developer.mozilla.org/en/DOM/window.navigator.onLine（浏览器支持在底部）
我正在使用以下代码来检查连接。注意：上述解决方案均不适用于 Firefox，它依赖于其内部的“离线工作”状态：
// Register listeners
window.addEventListener("offline", function(){
$('#globalDiv').hide();
$("#message").html('WARNING: Internet connection has been lost.').show();
});
window.addEventListener("online", function(){
$("#message").empty().hide();
$('#globalDiv').show();
});
【讨论】：
尝试将 ajaxSetup 设置为每 n 毫秒执行一次请求（我在这里设置了 1000）并检查它是否超时，然后禁用按钮。
$.ajaxSetup({
timeout: 1000,
error: function(request, status, maybe_an_exception_object) {
if(status != 'timeout')
//Code to enable button
else
//Code to disable button
}
});
【讨论】：
使用window.navigator.onLine 本质上是不可靠的，因为用户可能已连接到网络，但该网络无法访问互联网。
但是，这里是一个准系统示例
<!DOCTYPE HTML>
<html>
<head>
<title>Online status</title>
<script>
function updateIndicator() {
document.getElementById('indicator').textContent = navigator.onLine ? 'online' : 'offline';
}
</script>
</head>
<body onload="updateIndicator()" ononline="updateIndicator()" onoffline="updateIndicator()">
<p>The network is: <span id="indicator">(state unknown)</span>
</body>
</html>
查看实际操作中的小提琴：http://jsfiddle.net/3rRWK/
【讨论】：
这是我要做的，基于：how to check if the user has the connection to the internet
首先，使用 javascript 库链接来确定用户是否在线。如果为 true，则将表单的 action 属性更改为在线页面，否则为离线页面。
<script src="https://ajax.googleapis.com/ajax/libs/prototype/1.7.0.0/prototype.js></script>
<script>
$('#target').submit(function() {
if (typeof window.$ !== 'function') {
$('myform').attr( "action" , "offlinepage.html" );
}
else
{
$('myform').attr( "action" , "onlinepage.html" );
}
});
</script>
【讨论】：