Wie kann jQuery verschiedene Elemente basierend auf einer Variablen zeigen

-1

Ich möchte eine Navigationsleiste erstellen, die auf jeder Seite verwendet werden kann. Die meisten Navigationselemente haben das gleiche Styling, jedoch unterscheidet sich das Navigationselement, das sich auf die aktuelle Seite bezieht, unterschiedlich. Ich möchte in der Lage sein, mit jQuery ein Meta-Tag zu lesen und das korrekte Styling anzuzeigen.Wie kann jQuery verschiedene Elemente basierend auf einer Variablen zeigen

Ich habe meinen Code unten eingefügt - das ist nicht zu funktionieren scheint:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<meta name="page-name" content="about"/> 
<title>Untitled Document</title> 
<link href="frame_styles.css" rel="stylesheet" type="text/css" /> 
<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.2.6.js" ></script> 
<script> 
var pageName = $('meta[name=page-name]').attr("content"); 
    $(document).ready(function() { 
     if (pageName="about") { 
      $('#about').addClass('selected'); 
     } 
    }); 
</script> 
</head> 

<body> 

<table border="0" cellspacing="0" cellpadding="8"> 
    <tr> 
<td align="center" bgcolor="#0099CC">&nbsp;</td> 
<td align="center" nowrap="nowrap" bgcolor="#0099CC"><a class="navLinks"href="">Home</a></td> 
<td align="center" nowrap="nowrap" bgcolor="#0099CC"><a class="navLinks" href="">News &amp; Events</a></td> 
<td align="center" nowrap="nowrap" bgcolor="#0099CC"><a id="about" class="navLinks" href="">About</a></td> 
<td align="center" nowrap="nowrap" bgcolor="#0099CC"><a class="navLinks" href="">Services</a></td> 
<td align="center" nowrap="nowrap" bgcolor="#0099CC"><a class="navLinks" href="">eResearch</a></td> 
<td align="center" nowrap="nowrap" bgcolor="#0099CC"><a class="navLinks" href="">Industry &amp; Government</a></td> 
<td align="center" nowrap="nowrap" bgcolor="#0099CC" class="selected">Education &amp; Training</td> 
<td align="center" nowrap="nowrap" bgcolor="#0099CC"><a href="" class="navLinks" >Multimedia</a></td> 
    <td align="center" nowrap="nowrap" bgcolor="#0099CC">&nbsp;</td> 
    </tr> 
</table> 
<p>s</p> 
</body> 
</html>` 



@charset "utf-8"; 
/* CSS Document */ 

.navLinks{ 
font-family:Verdana, Geneva, sans-serif; 
font-size:small; 
color:#FFF; 
text-decoration:none; 
} 

.quick-links{ 
    text-decoration:none; 
} 

#quick-links-table{ 
    border-top:2px solid #0099CC; 
    border-bottom:1px solid #0099CC; 
} 

.text{ 
    font-family:Verdana, Geneva, sans-serif; 
    font-size:small; 
} 

.selected{ 
    background:#FFF; 
    font-family:Verdana, Geneva, sans-serif; 
    font-size:small; 
    color:#000; 
}

Quelle

2009-06-26 Ankur

@Ankur Es funktioniert, aber diese Zeile ändern:

if(pageName="about")

bis

if(pageName=="about")

statt Vergleich können Sie pagename wie folgt verwenden: (! Schlag Kopf)

$("#"+pageName).addClass("selected");

Quelle

2009-06-26 05:10:47 TheVillageIdiot

Ihre Lösung funktioniert, Ich versuche, die Antwort zu akzeptieren, aber es scheint nicht – Ankur

“zu registrieren .... aber es scheint nicht zu registrieren "Ich kann dich nicht bekommen? – TheVillageIdiot

Siehst du deine Antwort als akzeptiert - ich nicht - obwohl ich mehrmals auf das Häkchen geklickt habe und das rote Kästchen gedrückt habe, um darauf hinzuweisen, dass es angeklickt wurde. – Ankur

Wie wäre:

var meta = $("meta").get(1).attr("content"); 
if(meta == 'about') { 
    $('#about').addClass('selected'); 
}

Quelle

2009-06-26 05:04:45 karim79

Wie kann jQuery verschiedene Elemente basierend auf einer Variablen zeigen

Antwort

Verwandte Themen