MyBB.de Forum
JS - Problem mit Bildwechsel auf "onclick" - Druckversion

+- MyBB.de Forum (https://www.mybb.de/forum)
+-- Forum: Sonstiges (https://www.mybb.de/forum/forum-1.html)
+--- Forum: Programmierung (https://www.mybb.de/forum/forum-32.html)
+--- Thema: JS - Problem mit Bildwechsel auf "onclick" (/thread-21860.html)

JS - Problem mit Bildwechsel auf "onclick" - Jockl - 09.12.2009

Hallo zusammen,

für das Plugin ShowOnlineToday habe ich das zugehörige Template so angepasst, dass es eingeklappt ist und mittels "onklick()" vom User geöffnet werden kann. Das funktioniert mit dem u.a. Code, indem man auf "+/-" klickt.
Code:
<script type='text/javascript'>
function showonlinetoday(){
if (document.getElementById('onlineToday').style.display == 'none')
{
    if(navigator.appName == 'Microsoft Internet Explorer')
        {
        document.getElementById('onlineToday').style.display='block';
        }
        else
        {
        document.getElementById('onlineToday').style.display='table-row';
        }
    }
    else
        {
        document.getElementById('onlineToday').style.display = 'none';
        }
    }
</script>
<tr>
    <td class="tcat">
        <span style="float:right;">
            <a style='cursor:pointer'onclick='showonlinetoday()'>
                <span style="font-size:1.2em;font-weight:bold;">+/-</span>
            </a>
        </span>
        <strong>{$lang->whos_online_today}</strong>
    </td>
</tr>
<tr id='onlineToday' style='display:none;'>
    <td class="trow1">
    <span class="smalltext">{$lang->online_note_today}<br />{$onlinemembers}</span>
    </td>
</tr>
Nun wollte statt dem "+/-" mittels innerHTML einen wechselnden Text einfügen. Das funktioniert leider im IE nicht, weil dieser innerHTML in Tabellen nur lesen aber nicht schreiben kann.
Also habe ich mir überlegt, statt dessen ein Bild einzufügen und dieses bei "onklick()" jeweils zu wechseln.
Den entsprechenden Code findet Ihr nachfolgend.
Code:
<script type='text/javascript'>
function showonlinetoday(){
if (document.getElementById('onlineToday').style.display == 'none')
{
    if(navigator.appName == 'Microsoft Internet Explorer')
        {
        document.getElementById('onlineToday').style.display='block';
        }
        else
        {
        document.getElementById('onlineToday').style.display='table-row';
        }
}
else
    {
        document.getElementById('onlineToday').style.display = 'none';
    }
};
if (document.getElementById('test01').src == 'images/collapse_collapsed.gif')
{
    document.getElementById('test01').src='images/collapse.gif'
}
else
{
    tdocument.getElementById('test01').src='images/collapse_collapsed.gif'
}
</script>
<tr>
    <td class="tcat">
        <span style="float:right;">
            <img id='test01' src="images/collapse_collapsed.gif" style='cursor:pointer'
                onclick="showonlinetoday()" />
        </span>
        <strong>{$lang->whos_online_today}</strong>
    </td>
</tr>
<tr id='onlineToday' style='display:none;'>
    <td class="trow1">
    <span class="smalltext">{$lang->online_note_today}<br />{$onlinemembers}</span>
    </td>
</tr>
Leider funktioniert der Bildwechsel nicht. Weder im FF noch im IE. Sad
Ich habe es auch schon mit
Code:
this.src
statt mit
Code:
document.getElementById('test01').src
probiert. Ebenfalls ohne Erfolg.

Würde mich über einen Tipp freuen, was ich da falsch mache.

Dankeschön! Smile

RE: JS - Problem mit Bildwechsel auf "onclikck" - StefanT - 09.12.2009

Warum gibst du der Spalte nicht die ID? Dann müsste es doch funktionieren.

RE: JS - Problem mit Bildwechsel auf "onclick" - Jockl - 09.12.2009

Du meinst so?
Code:
<td id="test01" class="tcat">

Leider funktioniert das auch nicht.


Edit:
habe es hin bekommen. Danke.