jquery-1.8.1.min
Hallo,
ich versuche gerade meine ersten Schritte in jQuery.Aber ich komme bei dem Einbinden der hover-Funktion nicht weiter.
Ich habe eine HTML-Tabelle mit der ID "standorte".Diese sieht wie folgt aus:
<table id="standorte">
<tr>
<th>Standort</th>
<th>Mitarbeiter</th>
<th>Seit</th>
</tr>
<tr>
<td>München</td>
<td>1000</td>
<td>1995</td>
</tr>
<tr>
<td>Berlin</td>
<td>5000</td>
<td>1989</td>
</tr>
also nicht so spektakulär 😉
folgende jQuery-Anweisungen zum Einfärben der Tabelle funktionieren auch:
$('#standorte tr:odd').css('background-color', '#ccc');
$('#standorte tr:even').css('background-color', '#eee');
$('#standorte tr:first').css('background-color', '#aaa');
Das Problem habe ich bei der hover-Funktion,mit der ich die aktuelle Zeile hervorheben möchte:
Ich bekomme per "console.log" leider keine Ausgabe von mouseover und mouseout
<script type="text/javascript">
//<![CDATA[
$(document).ready(function () {
$('.menu > ul > li > a').click(function () {
$(this).next('ul').slideToggle();
});
$('#standorte tr:odd').css('background-color', '#ccc');
$('#standorte tr:even').css('background-color', '#eee');
$('#standorte tr:first').css('background-color', '#aaa');
// funktioniert leider nicht
$('#standorte tr:not(tr:first)').hover(function () {
//Mouseover
console.log('mouseover');
}, function () {
//Mouseout
console.log('mouseout');
});
});
//]]>
</script>
Ich habe es auch schon mit verschiedenen Browsern getestet(FF,IE,Chrome),das hat mich leider auch nicht weitergebracht...
Weiß jemand,woran das liegen könnte ?
Hallo xrc7581,
dein jQuery-Selektor ist falsch — das zweite tr
gehört dort nicht hin. Korrekt wäre demnach $("#standorte tr:not(:first)")
. Auch möglich wäre $("#standorte").find("tr:gt(0)")
, also die Selektion aller Zeilen mit einem Index größer als 0.
Im übrigen eignet sich JsFiddle wunderbar, um dein Problem zum Debuggen zur Verfügung zu stellen. Anhand deines Beispiels sähe das so aus.
m0rius
Mein Blog: blog.mariusschulz.com
Hochwertige Malerarbeiten in Magdeburg und Umgebung: M'Decor, Ihr Maler für Magdeburg
Hallo m0rius,
alles funktioniert bestens, dank deiner Hilfe.
Ich hatte das Statementtr:not(tr:first) so verstanden, dass mir alle tr-Elemente,außer dem ersten tr zurückgegeben werden.
Da hatte ich wohl daneben gelegen 😭
P.S. Danke für JsFiddle !!! 👍
Hallo xrc7581,
das macht es ja – fast – auch, nur war dort eben ein tr
zu viel enthalten.
m0rius
P.S: Bitte denk das nächste Mal daran, deinen Code einzurücken. Das erleichtert die Lesbarkeit enorm und sorgt vermutlich auch dafür, dass du mehr Antworten bekommst.
Mein Blog: blog.mariusschulz.com
Hochwertige Malerarbeiten in Magdeburg und Umgebung: M'Decor, Ihr Maler für Magdeburg