Question

目前，我为移动设备和计算机创建的此应用程序可以离线存储数据。例如，用户可以在框中键入数据，单击“保存”按钮，关闭其互联网并加载刚刚存储的数据以供离线使用。我想改进这个功能，以便它会列出来自任何wesbsite的离线新闻文章，我不关心它是什么网站，只要它显示离线使用的新闻文章。关于该怎么做的任何想法？

这是HTML

<!DOCTYPE html>
<html manifest="offline.manifest">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Offline test page</title>
<link rel="stylesheet" type="text/css" media="all" href="styles.css" />
</head>
<body>

<p id="status">Online</p>

<h1>Off-line test page</h1>
<p>This page detects when the browser goes off-line and stores data locally.</p>

<form id="mainform" action="index.html" method="post">
<fieldset>
<legend>Update data</legend>

<label>Data item 1: <input type="text" id="data1" name="data1" value="" /></label>

<button type="submit">Save Data</button>

</fieldset>
</form>

<p>Use File &gt; Work Offline in Firefox to switch online/offline modes.</p>
<p><a href="index.html">Refresh the page</a> in offline mode to reload data from store.</p>


<script type="text/javascript" src="jquery-1.4.min.js"></script>
<script type="text/javascript" src="offline.js"></script>

</body>
</html>

这是Javascript

// page loaded
jQuery(document).ready(function($) {

    // form data saving
    $("#mainform").submit(lib.Save);

    // online/offline event handler
    if (window.sessionStorage) {
        lib.Net.ChangeStatus();
        $(window).bind('online offline', lib.Net.ChangeStatus);
    }

    // load data
    lib.Load();

});

// online/offline library
var lib = lib || {};

lib.Net = function() {

    var online = true;

    // is browser online?
    function Online() { return navigator.onLine; }

    // online/offline event
    function ChangeStatus() {
        if (online != Online()) {
            online = Online();
            var s = $("#status");
            s.text(online ? "Online" : "Offline");
            if (online) s.removeClass("offline");
            else s.addClass("offline");
        }
    }

    return {
        Online: Online,
        ChangeStatus: ChangeStatus
    };

}();

// save data online or offline
lib.Save = function(e) {

    e.preventDefault();

    if (lib.Net.Online() || !window.sessionStorage) {

        // save data online
        alert("Data has been saved online.");

    }
    else {

        // save data offline
        $("#mainform input").each(function(i) {
            window.sessionStorage.setItem(this.id, this.value);
        });
        alert("Data has been saved offline.");

    }

};

// load data online or offline
lib.Load = function() {

    if (lib.Net.Online() || !window.sessionStorage) {

        // load data online
        alert("Currently online:\ndata could be loaded from server.");

    }
    else {

        // load data offline
        $("#mainform input").each(function(i) {
            this.value = window.sessionStorage.getItem(this.id);
        });
        alert("Data has been loaded from offline store.");

    }

};

Answer 1

你要做的是制作像Pocket这样的应用程序？

您需要的是以html / css样式或其他内容保存来自不同网站的文章，例如pdf文件。获取html / css并保存或将其转换为pdf并保存pdf。之后，你可以加载它。

你必须使用LocalDB或类似的东西来保存链接到你保存的文件。

一种在脱机应用程序中存储数据的方法

1 个答案: