• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

html: Bildaufruf mit variablen-wert als teil der Dateiname (indirekte Adressierung)

timmertechnik

timmertechnik

Neues Mitglied
Moin Experten,

kann mir jemand eine(n) Lösung(sansatz) geben wie ich der wert eine Variable in der Dateiname "einbau"?

Das anzeigen klappt wunderbar mit:

<div id="VarId1">VALUE1</div>


Nun soll ich ein Bild abhängig vom Variablenwert Anzeigen, anstelle des X soll der wert aus der Variable eingefügt werden:

<img src='Start-Dateien/1000X'.png' width="563" height="215">

damit am ende 10000.png, 10001.png, 10002.png oder 10004.png angezeigt wird.


Ich probiere und Google jetzt schon seit 2 Tage, habe aber noch keine Lösung gefunden die Variable über seine id auf zu rufen und ein zu fügen o.ä.

Vielen Dank
 
basti1012

basti1012

Senior HTML'ler
meinst du das so
HTML: 
<body>
  <div id="var1">homer</div>
  <div id="aus"></div>
<script>
 wert=document.getElementById('var1').innerHTML;
document.getElementById('aus').innerHTML='<img src="http://sebastian1012.bplaced.net/bilder/'+wert+'.jpeg">';
  </script>
</body>
 
timmertechnik

timmertechnik

Neues Mitglied
leider nein, von der Variable der auf eine andere Seite definiert wird
HTML: 
<body onload="mainJavaScript()">
        
        <table id="singleVariablesTable" border="1">
            <tr>
                <td>
                    Variablenwert
                </td>
                <td>
                    ID
                </td>
                <td>
                    Variable
                </td>
            </tr>
            <tr>
                <td>
                    :="DB_Anlagenstatus"."10000":
                </td>
                <td>
                    VarId1
                </td>
                <td>
                    DB_Anlagenstatus.10000
                </td>
            </tr>
        </table>

    </body>

soll der wert ein TEIL der angezeigter Dateiname werden. :="DB_Anlagenstatus".10000": ist ein wert der aus eine SPS gelesen wird

Dieser Wert kann ich Anzeigen:
HTML: 
Wert der erste Variable (in DIV-element): <div id="VarId1">VALUE1</div>

aber dieser wert soll das X erseten damit ich das richtige Bild Anzeige:
HTML: 
<body>
    
    <!-- Modul 10000 -->
    <div>
    <span style='position:absolute;left:234px;top:825px'>
    <img src='Start-Dateien/1000X.png' width="563" height="215">
    </div>
</body>
 
basti1012

basti1012

Senior HTML'ler
Ehrlich gesagt verstehe ich es trotzdem nicht ,ich komme trotzdem noch auf das Script in post2 .Statt homer steht dann da dein Wert
DB_Anlagenstatus.10000.

Warten wir mal ab bis einer kommt der ausgeschlafener ist als ich,ich scheckes heute wohl nicht mehr.
 
Aaron3219

Aaron3219

Senior HTML'ler
basti1012 schrieb:
ich komme trotzdem noch auf das Script in post2
Zum Vergrößern anklicken....
Und ich auch...

Was basti mach ist, er ließt den Text aus dem div aus und setzt ihn als Variable. In dem div mit der ID 'aus', gibt er dann das Bild aus.
Ein wenig 'sauberer' geschrieben, sieht der Code so aus.

HTML: 
<body>
  <div id="var1">Variable_aus_Datei</div>
  <img id="aus" src="" alt="">
  <script>
       wert=document.getElementById('var1').innerHTML;
       document.getElementById('aus').setAttribute('src', 'Start-Dateien/1000'+wert+'.png');
  </script>
</body>
Was also soll jetzt falsch daran sein?
http://jsfiddle.net/bk26ta5o/

Schau es dir selbst an. Wenn du dir das src des img-Tags anschaust, ist es genau das, was du willst!
 
timmertechnik

timmertechnik

Neues Mitglied
Es klappt nicht. Ich Poste mal meine ganze Code, erst mal die Seite die Fertig ist und Funktioniert. Die Seite sammelt und aktualisiert die Daten aus der SPS und stellt Sie in eine Tabelle dar:

HTML: 
<html>
    <head>
        <meta content="text/html; charset=UTF-8" http-equiv="content-type" />
        <title>- Automatic update - Update page</title>
        <script type="text/javascript">
         /* String.trim() is not supported by every browser - thus add this functionality is necessary */
         if (!String.trim)
         {
            String.prototype.trim = function () { return this.replace(/^(\s|\u00A0)+|(\s|\u00A0)+$/g, ''); };
         }
       
         /* Main function for calling the subroutines */
         function mainJavaScript()
         {
            updateSingleVariablesTable();
         }
           
         /* Function for updating the variables */
         function updateSingleVariablesTable()
         {
            var table = document.getElementById("singleVariablesTable");
            for(i = 1; i < table.rows.length; i++)
            {
                var tagValue = table.rows[i].getElementsByTagName("td")[0].innerHTML;
                var tagId = table.rows[i].getElementsByTagName("td")[1].innerHTML.trim();
                parent.document.getElementById(tagId).innerHTML = tagValue;
            }
         }
       
         setInterval("document.location.reload()",1000);
        </script>
    </head>
   
    <body onload="mainJavaScript()">
       
        <table id="singleVariablesTable" border="1">
            <tr>
                <td>
                    Variablenwert
                </td>
                <td>
                    ID
                </td>
                <td>
                    Variable
                </td>
            </tr>
            <tr>
                <td>
                    :="DB_Anlagenstatus"."10000":
                </td>
                <td>
                    VarId1
                </td>
                <td>
                    DB_Anlagenstatus.10000
                </td>
            </tr>
            <tr>
                <td>
                    :="DB_Anlagenstatus"."20000":
                </td>
                <td>
                    VarId2
                </td>
                <td>
                    DB_Anlagenstatus.20000
                </td>
            </tr>
            <tr>
                <td>
                    :="DB_Anlagenstatus"."30000":
                </td>
                <td>
                    VarId3
                </td>
                <td>
                    DB_Anlagenstatus.30000
                </td>
            </tr>
            <tr>
                <td>
                    :="DB_Anlagenstatus"."40000":
                </td>
                <td>
                    VarId4
                </td>
                <td>
                    DB_Anlagenstatus.40000
                </td>
            </tr>
            <tr>
                <td>
                    :="DB_Anlagenstatus"."50000":
                </td>
                <td>
                    VarId5
                </td>
                <td>
                    DB_Anlagenstatus.50000
                </td>
            </tr>
            <tr>
                <td>
                    :="DB_Anlagenstatus"."60000":
                </td>
                <td>
                    VarId6
                </td>
                <td>
                    DB_Anlagenstatus.60000
                </td>
            </tr>
            <tr>
                <td>
                    :="DB_Anlagenstatus"."90000":
                </td>
                <td>
                    VarId7
                </td>
                <td>
                    DB_Anlagenstatus.90000
                </td>
            </tr>
            <tr>
                <td>
                    :="DB_Anlagenstatus"."100000":
                </td>
                <td>
                    VarId8
                </td>
                <td>
                    DB_Anlagenstatus.100000
                </td>
            </tr>
            <tr>
                <td>
                    :="DB_Anlagenstatus"."Engmatec_1":
                </td>
                <td>
                    VarId9
                </td>
                <td>
                    DB_Anlagenstatus.Engmatec_1
                </td>
            </tr>
            <tr>
                <td>
                    :="DB_Anlagenstatus"."Engmatec_2":
                </td>
                <td>
                    VarId10
                </td>
                <td>
                    DB_Anlagenstatus.Engmatec_2
                </td>
            </tr>
            <tr>
                <td>
                    :="DB_Anlagenstatus"."Engmatec_3":
                </td>
                <td>
                    VarId11
                </td>
                <td>
                    DB_Anlagenstatus.Engmatec_3
                </td>
            </tr>
            <tr>
                <td>
                    :="DB_Anlagenstatus"."Reserve_1":
                </td>
                <td>
                    VarId12
                </td>
                <td>
                    DB_Anlagenstatus.Reserve_1
                </td>
            </tr>
            <tr>
                <td>
                    :="DB_Anlagenstatus"."Reserve_2":
                </td>
                <td>
                    VarId13
                </td>
                <td>
                    DB_Anlagenstatus.Reserve_2
                </td>
            </tr>
            <tr>
                <td>
                    :="DB_Anlagenstatus"."Reserve_3":
                </td>
                <td>
                    VarId14
                </td>
                <td>
                    DB_Anlagenstatus.Reserve_3
                </td>
            </tr>
            <tr>
                <td>
                    :="DB_Anlagenstatus"."Reserve_4":
                </td>
                <td>
                    VarId15
                </td>
                <td>
                    DB_Anlagenstatus.Reserve_4
                </td>
            </tr>
            <tr>
                <td>
                    :="DB_Anlagenstatus"."Reserve_5":
                </td>
                <td>
                    VarId16
                </td>
                <td>
                    DB_Anlagenstatus.Reserve_5
                </td>
            </tr>
        </table>

    </body>
</html>

Jetzt muss ich mit diesen Daten die verschieden Anlagenzustände mit verschiedene Bilder darstellen. Dazu gibt es für jedes Anlagenteil Bilder die sich nur in der letzte ziffer unterscheiden. Ich bekomme mit der unterstehende Code aber kein Bild angezeigt für 10000. Bei den anderen ist das Bild da, weil ich die Daten direkt aus der SPS hole. Ich muss diesen Umweg gehen weil sonst beim Aktualisieren das Bild ständig flackert.

HTML: 
<html>

<!-- Kopf -->
<head>
    <meta content="text/html; charset=UTF-8" http-equiv="content-type" />
   
    <meta name=Originator content="timmertechnik GmbH">
   
    <title>DAI MARS KEY Anlagenstatus</title>
       
</head>

<!-- Hintergrund und text -->
<div>
    <!-- Überschrift -->
    <br>
    <br>
    <h1>
        <center>
            <font face="Arial">
                <span style="font-size: 72px; margin: 100px 0;"><strong>Anlagenstatus</strong></span>
            </font>
        </center>
    </h1>

    <!-- Logo -->
    <span style='position:absolute;left:1725px;top:25px;width:105px;height:120px'>
        <img width=105 height=120 src="Start-Dateien/Logo.jpg"
    </span>

    <!-- Layout -->
    </span>
        <img src="Start-Dateien/Layout.jpg" width="1925" height="986">
    </span>
</div>

<!-- Anlagenteile -->
<body>
   
    <!-- Modul 10000 -->
    <div>
    <span style='position:absolute;left:234px;top:825px'>
    <img id="aus" src="" alt="klappt nicht" width="563" height="215">
        <script>
            wert=document.getElementById('VarId1').innerHTML;
            document.getElementById('aus').setAttribute('src', 'Start-Dateien/1000'+wert+'.png');
        </script>
    </div>

    <!-- Modul 20000 -->
    <div>
    <span style='position:absolute;left:234px;top:616px'>
    <img src='Start-Dateien/2000:="DB_Anlagenstatus"."20000":.png' width="561" height="216">
    </div>

    <!-- Modul 30000 -->
    <div>
    <span style='position:absolute;left:760px;top:663px'>
    <img src='Start-Dateien/3000:="DB_Anlagenstatus"."30000":.png' width="348" height="168">
    </div>

    <!-- Modul 40000 -->
    <div>
    <span style='position:absolute;left:1100px;top:548px'>
    <img src='Start-Dateien/4000:="DB_Anlagenstatus"."40000":.png' width="556" height="284">
    </div>

    <!-- Modul 50000 -->
    <div>
    <span style='position:absolute;left:778px;top:825px'>
    <img src='Start-Dateien/5000:="DB_Anlagenstatus"."50000":.png' width="448" height="250">
    </div>

    <!-- Modul 60000 -->
    <div>
    <span style='position:absolute;left:1219px;top:825px'>
    <img src='Start-Dateien/6000:="DB_Anlagenstatus"."60000":.png' width="439" height="245">
    </div>

    <!-- Modul 90000 -->
    <div>
    <span style='position:absolute;left:62px;top:478px'>
    <img src='Start-Dateien/9000:="DB_Anlagenstatus"."90000":.png' width="180" height="403">
    </div>

    <!-- Modul 100000 -->
    <div>
    <span style='position:absolute;left:300px;top:450px'>
    <img src='Start-Dateien/10000:="DB_Anlagenstatus"."100000":.png' width="281" height="107">
    </div>
       
    <iframe src="Update_Page.html" style="display:none;" />
</body>

</html>

Ich bin kein Profi und kenne mich nicht aus, trotzdem muss ich es zum laufen bekommen. Bin für jede Hilfe sehr Dankbar!
 
Sempervivum

Sempervivum

Senior HTML'ler
Code: 
               <td>
                    :="DB_Anlagenstatus"."10000":
                </td>
:="DB_Anlagenstatus".10000": ist ein wert der aus eine SPS gelesen wird
Zum Vergrößern anklicken....
Wie gelangt dieser Wert denn in das HTML? Da muss es doch noch mehr geben als reines HTML?
Aber ohne das zu verstehen, könnte es so funktieren:
Code: 
<span id="thevalue" style="display:none;">:="DB_Anlagenstatus"."10000":</span>

<img id="theimg"  width="563" height="215">
<script>
var theval = document.getElementById("thevalue").textContent;
document.getElementById("theimg").src = 'Start-Dateien/1000' + theval + '.png';
</script>
 
basti1012

basti1012

Senior HTML'ler
Fals der Code von @Sempervivum auch nicht klappt dann probier mal das.
den Code von sempervivum und änder nur die eine Zeile
Code: 
<script>
var theval = document.getElementById("VarId1").innerHTML.trim();
document.getElementById("theimg").src = 'Start-Dateien/1000' + theval + '.png';
</script>
Ich habe deine Scripte mal ausprobiert und es werden die Zeilenumbrüche mit ausgegeben bzw du hast einfach 2 Leerzeilen damit drinne . Mit trim() gehen die weg.
Hier die pen dazu https://codepen.io/basti1012/pen/MXmypQ?editors=1010

Zum testen habe ich mein homer Bild genommen ,Was ohne trim() auch nicht lief.
Vieleicht läst sich im Code noch was besseres finden als trim(),aber das können die beiden besser sagen als ich ob es da was gibt.
 
Zuletzt bearbeitet:
F

Frank_x

Neues Mitglied
Servus,

ich habe exakt das gleiche Problem und suche schon einige Zeit nach der Ursache.

Wurde das Problem gelöst? Hat jemand ein getestetes funktionierendes Beispiel?
 
Sempervivum

Sempervivum

Senior HTML'ler
Ich habe zwar kaum eine Ahnung von diesen SPS-Sachen aber inzwischen verstehe ich das Ganze ein klein wenig besser. Und ich bin der Meinung, dass der Code aus meinem Posting #7 funktionieren sollte. Nur leider ist vom Fragesteller damals keine Rückmeldung gekommen. Versuche es mal so und wenn Du nicht zum Ziel kommst, beschreibe genauer, was Du vorhast und was nicht funktioniert.
 
F

Frank_x

Neues Mitglied
Ich denke das ist ein reines HTML Problem und daher vermutlich SPS Hintergrundwissen nicht unbedingt nötig.

Ich möcht eine Statusabfrage zur besseren Übersicht grafisch animieren. Das jeweilige Signal hat den zustand 0 oder 1.
Die Daten werden per Java Skript aus der SPS gelesen und dem HTML zur Verfügung gestellt. Per Textausgabe funktioniert auch alles wunderbar, nur mit der Grafik habe ich das Problem.

Das habe ich getestet und funktioniert:
Diese Variabel id="o_mStatusVerbindung" wird per Java Skript aktualisiert und angezeigt wird 0 oder 1
Code: 
<table border="1">
<tr>
<td style="width: 470px"><span class="auto-style4">Verbindungstatus</span> </td>
    <td class="auto-style4"id="o_mStatusVerbindung">mStatusVerbindung:</td>
</tr>   
</table>

So sieht das aus
1641577754913.png

Statt 0 oder 1 sollen diese Grafiken angezeigt werden.

1641577972990.png
Die Lösungsansätze von weiter oben habe ich schon durchgearbeitet, hatte leider kein Erfolg.
 
Sempervivum

Sempervivum

Senior HTML'ler
OK, wenn Du die Variablen mit Javascript ausliest, sind ja die Gegebenheiten etwas anders und wahrscheinlich ist es dann sogar einfacher. Poste doch mal dieses Javascript bzw. den betr. Abschnitt. Geschieht das über Ajax?
 
F

Frank_x

Neues Mitglied
Das ist die Update_Page.html

Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta content="text/html; charset=UTF-8" http-equiv="content-type" />
        <title>Web page demo - Automatic update - Update page</title>
        <script type="text/javascript">
        
         /* String.trim() is not supported by every browser - thus add this functionality is necessary */
         if (!String.trim)
         {
            String.prototype.trim = function () { return this.replace(/^(\s|\u00A0)+|(\s|\u00A0)+$/g, ''); };
         }
        
         /* Main function for calling the subroutines */
         function mainJavaScript()
         {
            updateSingleVariablesTable();
            updateFrame();
         }
            
         /* Function for updating the variables */
         function updateSingleVariablesTable()
         {
            var table = document.getElementById("singleVariablesTable");
            for(i = 1; i < table.rows.length; i++)
            {
                var tagValue = table.rows[i].getElementsByTagName("td")[0].innerHTML;
                var tagId = table.rows[i].getElementsByTagName("td")[1].innerHTML.trim();
                parent.document.getElementById(tagId).innerHTML = tagValue;
            }
         }
        
         /* Function for updating the web page */
         function updateFrame()
         {
            window.setTimeout(function(){location.reload()}, document.getElementById("updateInterval").innerHTML.trim());
         }
        </script>

    </head>
    <body onload="mainJavaScript()">

        <table border="1">
            <tr>
                <td>
                    Update time in milliseconds
                </td>
            </tr>
            <tr>
                <td id="updateInterval" style="height: 28px">
                    1000</td>
            </tr>
        </table>
        <br/>

        <table id="singleVariablesTable" border="1">
            <tr>
                <td>
                    AWP-Command to read variable
                </td>
                <td>
                    ID of the element of the main page which should be updated
                </td>
            </tr>
            <tr>
                <td>
                    :="VarName1":
                </td>
                <td>
                    VarId1
                </td>
            </tr>
            <tr>
                <td>
                    :="VarName2":
                </td>
                <td>
                    VarId2
                </td>
            </tr>
                <tr>
                <td>
                    Value: <br/>
                    :="VarName3":
                </td>
                <td>
                    VarId3
                </td>
            </tr>
            <tr>
                <td>
                    :="IO_HmiPhotovoltaik".o_iTempWasserspeicher:
                </td>
                <td>
                    o_iTempWasserspeicher</td>
            </tr>
            <tr>
                <td>
                    :="IO_HmiPhotovoltaik".o_iTempKuehlkoerper:
                </td>
                <td>
                    o_iTempKuehlkoerper</td>
            </tr>
            <tr>
                <td style="height: 28px">
                    :="IO_HmiPhotovoltaik".o_iTempRueckVorHeizstab:
                </td>
                <td style="height: 28px">
                    o_iTempRueckVorHeizstab</td>
            </tr>
            <tr>
                <td>
                    :="IO_HmiPhotovoltaik".o_iTempRueckNachHeizstab:
                </td>
                <td>
                    o_iTempRueckNachHeizstab</td>
            </tr>
            <tr>
                <td>
                    :="IO_HmiPhotovoltaik".o_iTempVorlaufHeizung:
                </td>
                <td>
                    o_iTempVorlaufHeizung</td>
            </tr>
            <tr>
                <td>
                    :="IO_HmiPhotovoltaik".o_iSpannung:
                </td>
                <td>
                    o_iSpannung</td>
            </tr>
            <tr>
                <td>
                    :="IO_HmiPhotovoltaik".o_iStrom:
                </td>
                <td>
                    o_iStrom</td>
            </tr>
            <tr>
                <td>
                    :="IO_HmiPhotovoltaik".o_iLeistungWs:
                </td>
                <td>
                    o_iLeistungWs</td>
            </tr>
            <tr>
                <td>
                    :="IO_HmiPhotovoltaik".o_iLeistungWd:                 
                </td>
                <td>
                    o_iLeistungWd</td>
            </tr>
            <tr>
                <td>
                    :="IO_HmiPhotovoltaik".o_mStatusVerbindung:                 
                </td>
                <td>
                    o_mStatusVerbindung</td>
            </tr>
            <tr>
                <td>
                    :="IO_HmiPhotovoltaik".o_sSTA.mSpeicherHeizungEin:                 
                </td>
                <td>
                    o_sSTA.mSpeicherHeizungEin</td>
            </tr>
            <tr>
                <td>
                    :="IO_HmiPhotovoltaik".o_sSTA.mHeizungEin:                 
                </td>
                <td>
                    o_sSTA.mHeizungEin</td>
            </tr>
            <tr>
                <td>
                    :="IO_HmiPhotovoltaik".o_sStoerung.mF1:                 
                </td>
                <td>
                    o_sStoerung.mF1</td>
            </tr>
            <tr>
                <td>
                    :="IO_HmiPhotovoltaik".o_sStoerung.mF2:                 
                </td>
                <td>
                    o_sStoerung.mF2</td>
            </tr>
            <tr>
                <td>
                    :="IO_HmiPhotovoltaik".o_sStoerung.mF3:                 
                </td>
                <td>
                    o_sStoerung.mF3</td>
            </tr>
            <tr>
                <td>
                    :="IO_HmiPhotovoltaik".o_sStoerung.mUeberTempKK:                 
                </td>
                <td>
                    o_sStoerung.mUeberTempKK</td>
            </tr>       

        </table>

    </body>
</html>
 
Sempervivum

Sempervivum

Senior HTML'ler
Mit diesen Grafiken müsste es dann so funktionieren:
Code: 
         /* Function for updating the variables */
         function updateSingleVariablesTable()
         {
            var table = document.getElementById("singleVariablesTable");
            for(i = 1; i < table.rows.length; i++)
            {
                var tagValue = table.rows[i].getElementsByTagName("td")[0].innerHTML;
                var tagId = table.rows[i].getElementsByTagName("td")[1].innerHTML.trim();
                // Statt direkt den Wert 0 oder 1 in das Zielelement einzutragen,
                // erzeugen wir den Dateinamen des Bildes.
                // Ggf. musst Du noch berücksichtigen, dass das Bild
                // in einem Unterverzeichnis liegt.
                parent.document.getElementById(tagId).innerHTML
                    = 'ActorStatus' + tagValue + '.png';
            }
         }
Falls das nicht bei allen Werten passieren soll, müssen wir es noch über eine Klasse eingrenzen.
 
F

Frank_x

Neues Mitglied
Das funktioniert prinzipiell
Code: 
parent.document.getElementById(tagId).innerHTML = 'ActorStatus' + tagValue + '.png';

Rückgabewert der Variablen o_mStatusVerbindung ist ActionStatus 1 .png
Wo kommen die Leerzeichen her?

Bildnamen habe ich umbenannt um weiter testen zu können.

Jetzt habe ich versucht den Dateinamen aus der Variable dieser Funktion zu übergeben.
Irgendwas passt hier nicht.

Code: 
<img id="theimg">

<script>
document.getElementById("theimg").src = o_mStatusVerbindung';
</script>
 
Sempervivum

Sempervivum

Senior HTML'ler
Wo kommen die Leerzeichen her?
Zum Vergrößern anklicken....
Offenbar sind sie in der Variablen tagValue drin. Du kannst Sie mit der Funktion trim entfernen:
developer.mozilla.org

String.prototype.trim() - JavaScript | MDN

Die trim() Methode entfernt Leerzeichen an beiden Enden einer Zeichenfolge. Das betrifft Leerzeichen verschiedenster Art (space, tab, no-break space, etc.) und alle Zeilenumbruch einleitende Zeichen (LF, CR, etc.).
developer.mozilla.org developer.mozilla.org

Code: 
document.getElementById("theimg").src = o_mStatusVerbindung';
Da sehe ich ein Hochkomma vor dem Semikolon. Da es sich bei o_mStatusVerbindung um eine Variable handelt, ist es dort fehl am Platz.
 
F

Frank_x

Neues Mitglied
Schreibe ich das mit Anführungsstriche oder Hochkomma dann steht der Variablenname o_mStatusVerbindung in "theimg".
Ohne irgendwas erhalte ich die Fehlermeldung, nicht bekannt.

In HTML wird so zugegriffen. "id="o_mStatusVerbindung" und das funktioniert.
Wie muss man das in Java realisieren?

oder anders gefragt: Wie bekomme ich den Inhalt aus o_mStatusVerbindung in theimg damit die richtige Grafik angezeigt wird.
Eigentlich müsste das doch super einfach sein.
 
Sempervivum

Sempervivum

Senior HTML'ler
Ich habe mich geirrt: o_mStatusVerbindung ist keine Variable sondern der Inhalt einer Zelle in der Tabelle.
Außerdem habe ich inzwischen bemerkt, dass ich in dem Code in Posting #14 etwas wichtiges vergessen hatte: Wir müssen ja nicht nur dir URL der Grafik in die Tabellenzelle eintragen sondern auch ein img-Tag darum herum:
Code: 
         /* Function for updating the variables */
         function updateSingleVariablesTable()
         {
            var table = document.getElementById("singleVariablesTable");
            for(i = 1; i < table.rows.length; i++)
            {
                var tagValue = table.rows[i].getElementsByTagName("td")[0].innerHTML.trim();
                var tagId = table.rows[i].getElementsByTagName("td")[1].innerHTML.trim();
                // Statt direkt den Wert 0 oder 1 in das Zielelement einzutragen,
                // erzeugen wir den Dateinamen des Bildes.
                // Ggf. musst Du noch berücksichtigen, dass das Bild
                // in einem Unterverzeichnis liegt.
                parent.document.getElementById(tagId).innerHTML
                    = '<img src="ActorStatus' + tagValue + '.png">';
            }
         }
 
Zuletzt bearbeitet:
Du musst dich einloggen oder registrieren, um hier zu antworten.
Werbung:

Neueste Beiträge

Oben