2016-03-21 10 views
-2

Ich versuche tatsächlich, auf Variable anderer HTML-Datei mit JS zuzugreifen.JS acees Variable ein anderes HTML

Ich meine, ich habe eine Datei (Datei1.htm), die Dialogfeld öffnen, und ich möchte Informationen der ausgewählten Datei in eine andere Datei (file2.htm) senden und ändern Sie einen Wert in dieser Datei. Ich fand Lösung, sondern nur für JS-Dateien und nicht HTML:/

hatte ich es bereits mit 2 Dateien gemacht, aber file1a war die Eltern der anderen, so habe ich
parent.framWin = window; in file2a und framWin.divX=document.getElementById("one").offsetWidth; zum Beispiel in file1a um die Variable divX in file2a zu ändern (ich bin mir ziemlich sicher, das ist nicht die beste Lösung, aber es funktioniert;)). In diesem Fall sind Datei1 und Datei2 nicht übergeordnet, und sie befinden sich nur im selben Ordner.

Ich versuchte <script type="text/javascript" src="file1.htm"> Zugriff auf var, aber es scheint nicht zu funktionieren.

Haben Sie eine Idee, wie ich das erreichen kann?

Vielen Dank!

(Hier ist mein Code: file1.htm:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
    <title>SiteMap</title> 
    <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" /> 

<style type="text/css"> 

</style> 

<script type="text/javascript"> 
<!-- 

function OK(e){ 
    var name = document.getElementById("dialog").value; 
    //Here I would like to do something like File2.NameSpace1 = name; 
    //And File2.modifyMyName(); // But here, it's another question, to use JS script in another file ;) 
} 

//--> 
</script> 

</head> 
<body > 
<form action='' method='POST' enctype='multipart/form-data'> 
    <input type='file' name='userFile' onchange="OK()" id="dialog"> 
</form> 
</body> 
</html> 

und file2.htm:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
    <title>SiteMap</title> 
    <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" /> 

<script type="text/javascript"> 
<!-- 
    var NameSpace1; 

function modifyMyName(){ 
    document.GetElementById("first").src = NameSpace1; 
} 
//--> 
</script> 
</head> 
<body> 
    <div> 
     <img src ="" id="first" /> 
    </div> 
</body> 

Ich weiß, das nicht richtig funktioniert, weil es einige Fehler hier in der Syntax sind . Aber das Problem ist sichtbar;)

Thanks again :)

Antwort

2

Yo Sie können den Inhalt der Datei auf dem Server nicht einfach mit dem clientseitigen Code ändern.

Die von Ihnen genannten Beispiele ändern nur die Daten, die zum Zeitpunkt der Ausführung des Codes in den Browser geladen werden, während die Daten auf dem Server unverändert bleiben.

Es gibt zwei Ansätze, die Sie dazu nehmen können:

Speichern Sie die Änderungen im Browser.

Verwenden Sie auf Seite 1 localstorage, um Informationen über die Änderung aufzuzeichnen, die Sie vornehmen möchten. (Sie sollten das Bild wahrscheinlich in eine data: Schema-URL konvertieren, um dies anhand Ihres Beispielcodes zu erreichen).

In Seite zwei, haben einige mehr JS, die aus dem lokalen Speicher liest und verwendet diese Informationen, um die Änderung an sich selbst nach dem Laden zu machen.

Senden Sie die Änderungen an den Server.

Senden Sie ein Formular (Sie müssen also keinen clientseitigen Code verwenden) oder verwenden Sie Ajax, um Informationen über die Änderung an den Server zu senden.

Haben serverseitigen Code lesen Sie es und speichern Sie es dann in einer Sitzung (wenn Sie möchten, dass die Änderung für einen Benutzer sein) oder irgendwo dauerhafter (in einer Datenbank, wenn Sie sinnvoll sind, aber Sie könnten die Datei ändern direkt) (wenn Sie möchten, dass es zwischen Benutzern geteilt wird).

Seite zwei wäre dann ein serverseitiges Programm, das diese Daten lesen und zum Generieren der Seite verwenden würde.

+0

Okay, scheint es, dass ich Tonnen, was habe ich hier noch nicht verstehen:/ Ich werde versuchen, local nutzen zu können! Danke für deine schnelle Antwort :) Aber zuerst werde ich mir das alles ansehen. Nochmals vielen Dank –

1

Sie können localStorage verwenden, um diese Operation durchzuführen.

function OK(e){ 
    var name = document.getElementById("dialog").value; 
    window.localStorage.setItem('dialogValue', "Name"); 
} 

und in Ihrem file2.html

function modifyMyName(){ 
    var NameSpace1 = window.localStorage.getItem('dialogValue'); 
    document.GetElementById("first").src = NameSpace1; 
} 
+0

Wenn ich versuche, Ihren Code zu verwenden, habe ich eine "No wear kann ich" SetItem "von einer Nullreferenz oder nicht definiert" oder so ähnlich. Ich bin auf IE11 –

+0

Das tut mir wirklich leid. Es stellt sich heraus, IE11 haben Probleme in localStorage. Referenz: http: //stackoverflow.com/questions/21155137/javascript-localstorage-object-broken-in-ie-11-on-windows-7 Ich hatte es zuerst in Chrom getestet dann habe ich es hier geschrieben. Sie können auch sessionStorage verwenden. :) –

+0

Kein Problem;) Ich hatte das kurz vor dem Essen gefunden. Ich überprüfe auf SessionStorage;) –