Javascript -使用一个按钮来确定是否在线

Javascript - using a button to determine if online or not

本文关键字:按钮 在线 是否 一个 Javascript      更新时间:2023-09-26

我正在研究一些可以检测到是否有连接到互联网的东西。它的工作原理是ping一个图像文件,看看它是否存在。虽然代码作为一个整体的工作,我希望它不回发,如果它是离线的(因为它是一个页面,将托管在线-所以如果它发布回离线时,然后它会重新加载页面,做一个"页面未找到"),但仍然显示"离线"消息:

<asp:Button ID="Button1" runat="server" OnClientClick="ifServerOnline()" Text="Button" />
        <script type="text/javascript">
            function ifServerOnline(ifOnline, ifOffline)
            {
                var img = document.body.appendChild(document.createElement("img"));
                img.onload = function ()
                {
                    ifOnline && ifOnline.constructor == Function && ifOnline();
                };
                img.onerror = function ()
                {
                    ifOffline && ifOffline.constructor == Function && ifOffline();
                };
                img.src = "http://www.mypage.com/pixel.jpg?" + Date.now;
            }
            ifServerOnline(function ()
            {
                alert("Online");
            },
            function ()
            {
                alert("Offline");
            });
        </script>

显然mypage.com不存在(除非它存在,但它不是我的)。

编辑-最终代码:

<asp:Button ID="Button1" runat="server" OnClientClick="return ifServerOnline(ifServerOnline1, ifServerOffline1);" Text="Button" />
        <script type="text/javascript">
            function ifServerOnline(ifOnline, ifOffline)
            {
                var img = document.body.appendChild(document.createElement("img"));
                img.onload = function ()
                {
                    ifOnline && ifOnline.constructor == Function && ifOnline();
                };
                img.onerror = function ()
                {
                    ifOffline && ifOffline.constructor == Function && ifOffline();
                };
                img.src = "http://www.mypage.com/pixel.jpg?" + Date.now;
                return false;
            }
            function ifServerOnline1()
            {
                alert("Online");
                return false;
            }
            function ifServerOffline1()
            {
                alert("Offline");
                return false;
            }
        </script>

常见的方法是在处理程序结束时返回false,以防止默认控件的行为(在按钮的情况下,是发布表单):

function ifServerOnline(ifOnline, ifOffline)
{
    ...
    return false;
}

你也可能需要这个客户端点击处理程序(确保传递参数给ifServerOnline函数:

OnClientClick="return ifServerOnline(ifServerOnline, ifServerOffline);"

最后一件事。此方法确保在单击后根本没有回发。如果您仍然希望在联机情况下进行回发-您可能必须在ifServerOnline处理程序中手动执行。

更新。继续注释讨论-定义回调函数的最简单方法是:

function ifServerOnline()
{
    alert("Online");
}
function ifServerOffline()
{
    alert("Offline");
}