HTML Links die nichts machen trotz Base-Tags

Hey,

Ich habe ein Projekt das mit rewriterules sowie dem Base-Tag arbeitet.
Nun hab ich auf einer Seite sowas wie "Tabs" realisiert, d.h. wenn ich auf einen anderen Tab klicke -> Inhalt changed sich.
Die Tab-"Changer" sind als Links realisiert, also z.B.:
<li><a href="#" id="tab1" onclick="javascript:switchTab(0);">Benutzer</a></li>
Der Link @ # wird aber hinter das basedir gesetzt, d.h. wenn ich in / bin und auf den Link klicke, klappt es wunderbar, wenn ich jedoch in /unterverz/ bin und auf den Link klicke werde ich auf /# weitergeleitet.

Lange Rede, kurzer Sinn: Wie kann ich einen "leeren" Link machen oder dieses Tab-schema mit anderen Elementen (optimalerweise auch per onclick) realisieren?
(Habs jetzt mit li-Elementen gemacht, die dann per onclick umschalten - Trotzdem würde es mich interessieren obs irgendwie mit a's geht)

Danke im Voraus!


ChiefWiggum
 
Zuletzt bearbeitet:
der _gesamte_ HTML-Code wäre mal interessant, um das Problem mal selbst nachvollziehen zu können.

aber einen Tipp schonmal:
Code:
<li><a href="#" id="tab1" onclick="javascript:switchTab(0);[B]return false;[/B]">Benutzer</a></li>
das sorgt dafür, dass der eigentliche Link gar nicht erst verfolgt wird - also kein # an die URL angehängt wird.
 
Die Lösung funktioniert, danke (:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<title>bla</title>
<base href="http://localhost/eclipse/proj/" />
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<link REL="SHORTCUT ICON" HREF="favicon.ico">
<link rel="stylesheet" href="template/default/css/layout.css" 
    media="screen" type="">
<link rel="stylesheet" href="template/default/css/usercp.css"
    media="screen" type="">

<script>
    function _(name){
        return document.getElementById(name);
    }
    function switchTab(id){
        if(id == 0){
            _('benutzerdaten').style.display = 'block';
            _('produkte').style.display = 'none';
            _('tab1').style.backgroundColor = '#daecf8';
            _('tab1').style.borderBottom = '1px solid #daecf8';
            _('tab2').style.border = '1px solid #336699';
            _('tab2').style.backgroundColor = '#FFFFFF';
        } else if(id == 1){
            _('benutzerdaten').style.display = 'none';
            _('produkte').style.display = 'block';
            _('tab2').style.backgroundColor = '#daecf8';
            _('tab2').style.borderBottom = '1px solid #daecf8';
            _('tab1').style.border = '1px solid #336699';
            _('tab1').style.backgroundColor = '#FFFFFF';
        }
        return 0;
    }
</script>
</head>

<body>
<!-- jede menge zeugs -->
<div id="tabbar">
<ul id="tabs">
    <li><a href="#" id="tab1" onclick="javascript:switchTab(0);return false;">Benutzer</a></li>
    <li><a href="#" id="tab2" onclick="javascript:switchTab(1);return false;">Produkt</a></li>
</ul>
</div>
<!-- noch mehr zeugs -->
<div id="benutzerdaten">
blablabla
</div>

<div id="produkte" style="display: none;">    
asdFasdFasdF
</div>
</body>
</div>
</body>


Das sollte das wesentliche sein ;)
 
Zurück
Oben