2016-04-11 3 views
-3

senden, soweit ich weiß kann ich Daten an eine andere Seite senden, aber ich weiß nicht wie ... Ich nicht möchte Frameworks oder Bibliotheken wie jQuery verwenden. Ich möchte nur Javascript, HTML5 und CSS3 verwenden.Ich kann nicht den Weg finden, um den Wert eines Arrays auf eine andere Seite mit Javascript und HTML

Hier ist mein Code:

<!DOCTYPE html> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" lang="es-es"> 
<link rel="stylesheet" href="css/layout.css" type="text/css" media="screen"> 
<link rel="stylesheet" href="css/menu.css" type="text/css" media="screen"> 
<title>Read and Parse Lynis Log</title> 

<script> 

function processFiles(files) { 
var file = files[0]; 
var reader = new FileReader(); 
var textParsed = []; 

reader.onload = function (e) { 
    var output = document.getElementById("fileOutput"); 
    output.textContent = e.target.result; 

    var text = e.target.result; 
    var lines = text.split("\n"); 

    for (i=0; i<lines.length; i++) {  
     textParsed[i] = lines[i]; 
     console.log(textParsed[i]); 
    } 
}; 
reader.readAsText(file); 
} 
</script> 
</head> 

<body> 
<input id="fileInput" placeholder=":input" type="file" size="50" onchange="processFiles(this.files)"> 
<div id="fileOutput"></div> 
    <div class="container"> 
      <ul id="nav"> 
       <li><a href="#"><img src="images/t1.png" /> Dashboard</a></li> 
       <li><a href="#" class="sub" tabindex="1"><img src="images/t2.png" />Reporting</a><img src="images/up.gif" alt="" /> 
        <ul> 
         <li><a href="#"><img src="images/empty.gif" />LYNIS LOG</a></li> 
         <li><a href="#"><img src="images/empty.gif" />LYNIS REPORT</a></li> 
        </ul> 
       </li> 
       <li><a href="#" class="sub" tabindex="1"><img src="images/t3.png" />Lynis Tests</a><img src="images/up.gif" alt="" /> 
        <ul> 
         <li><a href="#"><img src="images/empty.gif" />Accounting</a></li> 
         <li><a href="#"><img src="images/empty.gif" />Authentication</a></li> 
         <li><a href="#"><img src="images/empty.gif" />Banner</a></li> 
         <li><a href="#"><img src="images/empty.gif" />Boot</a></li> 
         <li><a href="#"><img src="images/empty.gif" />Crypto</a></li> 
         <li><a href="#"><img src="images/empty.gif" />File Integrity</a></li> 
         <li><a href="#"><img src="images/empty.gif" />Firewall</a></li> 
         <li><a href="#"><img src="images/empty.gif" />Hardening</a></li> 
         <li><a href="#"><img src="images/empty.gif" />Kernel</a></li> 
         <li><a href="#"><img src="images/empty.gif" />Logging</a></li> 
         <li><a href="#"><img src="images/empty.gif" />Mail</a></li> 
         <li><a href="#"><img src="images/empty.gif" />Malware</a></li> 
         <li><a href="#"><img src="images/empty.gif" />Nameservers</a></li> 
         <li><a href="#"><img src="images/empty.gif" />Networking</a></li> 
         <li><a href="#"><img src="images/empty.gif" />PHP</a></li> 
         <li><a href="#"><img src="images/empty.gif" />Printing</a></li> 
         <li><a href="#"><img src="images/empty.gif" />Processes</a></li> 
         <li><a href="#"><img src="images/empty.gif" />Shell</a></li> 
         <li><a href="#"><img src="images/empty.gif" />Software</a></li> 
         <li><a href="#"><img src="images/empty.gif" />Squid</a></li> 
         <li><a href="#"><img src="images/empty.gif" />SSH</a></li> 
         <li><a href="#"><img src="images/empty.gif" />Storage</a></li> 
         <li><a href="#"><img src="images/empty.gif" />Time</a></li> 
         <li><a href="#"><img src="images/empty.gif" />Tooling</a></li> 
         <li><a href="#"><img src="images/empty.gif" />Web</a></li> 
        </ul> 
       </li> 
       <li><a href="#"><img src="images/t2.png" />Overview</a></li> 
      </ul> 
     </div> 
</body> 
</html> 

Sie können weitere Informationen über den Code in das folgende fiddle

sehen Wie Sie sehen können, wenn der Benutzer eine Textdatei auswählt, wird der Inhalt gespeichert ist das Array: var textParsed = [];

Dann ist meine Frage: Wenn ich das Array zu einer anderen Seite im Menü senden und es wieder als Variable verwenden möchte, zum Beispiel: var textParsed2, wie kann ich es tun? Die Kommunikation muss clientseitig sein!

+0

Define "Daten auf eine andere Seite senden". Möchten Sie Daten zwischen verschiedenen Tabs freigeben? Möchten Sie die Daten mit AJAX an Ihren Server senden? – Oriol

+0

Um Informationen zu senden, müssen Sie diese entweder posten (aber Sie benötigen ein serverseitiges Skript), oder Sie müssen Cookies setzen, lokalen Speicher verwenden oder die Informationen in einer URL senden. Wie auch immer, Sie brauchen eine Möglichkeit, diese Informationen zu übertragen. Alles, was auf der Seite selbst ist, ist verloren und vergessen, bevor die neue Seite geladen wird. – GolezTrol

+0

Ich würde URL als eine Möglichkeit zum Senden von Daten verwenden. Wenn Ihr Array beispielsweise "[1, 2, 3]" ist, lautet die URL "mynewpage.com/page-url/# 1-2-3", wobei hashtag das Array durch "-' getrennt definiert. Dann können Sie das Array mit JavaScript abkratzen. –

Antwort

0

Vielleicht versuchen Sie, Ihr Array als JSON zu speichern. Nutzen Sie die Vorteile von JSON.stringify() und JSON.parse(). Dies ermöglicht Ihnen, Ihr Array in einer Javascript-Sitzung zu speichern oder „localstorage“

var foo = []; 
    contacts[0] = "Roseanne Barr; 
    localStorage.setItem("contacts", JSON.stringify(contacts)); 

    //recall your stored values in a var 
    var storedContacts = JSON.parse(localStorage.getItem("contacts")); 
0

Ich würde mit Query-Strings in der URL vorschlagen. Es ist sehr leicht.

https://en.wikipedia.org/wiki/Query_string

How can I get query string values in JavaScript?

Sie können Query-Strings von URL window.location.search bekommen. Zum Beispiel kann eine URL wie: https://stackoverflow.com/?textParsed=some+awesome+text

function getQuery(name){ 
    if(name=(new RegExp('[?&]'+encodeURIComponent(name)+'=([^&]*)')).exec(window.location.search)) 
     return decodeURIComponent(name[1]); 
} 

var textParsed = getQuery("textParsed"); 
alert(textParsed); 

Wenn nicht, können Sie die html5 lokalen Speicher versuchen:

http://www.w3schools.com/html/html5_webstorage.asp

// Store 
localStorage.setItem("textParsed", "some awesome text"); 
// Retrieve 
localStorage.getItem("textParsed"); 

Wenn Sie nicht sicher, dass Ihre Benutzer sind verwendet eine "neue" Browser können Sie eine Kombination aus Abfragezeichenfolgen und lokalem Speicher verwenden.

Beispiel:

if(typeof(Storage) !== "undefined") { 
    // Code for localStorage/sessionStorage. 
} else { 
    // Code for QueryStrings 
} 
Verwandte Themen