使用 offline.js 隐藏提交按钮

Question

我正在使用 offline.js (0.7.18) 并且它工作正常，当我使用 on/offline 时指示器改变状态，到目前为止一切正常。

我还可以在 Offline JS Simulate UI 上看到，当 on/offline 被触发时，登录面板的样式会在 display:block 和 display:none 之间切换。但我无法发现它是如何工作的。

我想在触发离线时隐藏一个 'Submit' 按钮。

Answer 1

您可以使用离线 JS 模拟 UI 页面中的示例，该页面使用 jQuery:

<script>
    $(function(){

        var 
            $online = $('.online'),
            $offline = $('.offline');

        Offline.on('confirmed-down', function () {
            $online.fadeOut(function () {
                $offline.fadeIn();
            });
        });

        Offline.on('confirmed-up', function () {
            $offline.fadeOut(function () {
                $online.fadeIn();
            });
        });

    });
</script>

将class "online"赋给系统在线时显示的任何元素，将class "offline"赋给系统在线时显示的任何元素离线。

<button class="online">ABC</button>

使用 offline.js 隐藏提交按钮

Hiding Submit Button with offline.js

offline.js