jquery Toggleclass op div?
Ik heb de volgende code:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
2
3
4
5
6
7
8
9
10
11
12
13
<?php
<div class='content closed'>
tekst
</div>
<script type="text/javascript">
$(".content").click(function () {
$(this).toggleClass("closed");
$(this).toggleClass("open");
});
</script>
?>
<div class='content closed'>
tekst
</div>
<script type="text/javascript">
$(".content").click(function () {
$(this).toggleClass("closed");
$(this).toggleClass("open");
});
</script>
?>
Nu werkt de toggleClass niet. Als ik in chrome kijk bij het klikken, dan verandert de class wel, maar schiet HEEEEL snel terug naar closed. Iemand een idee wat ik fout doe?
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<?php
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
<button>Toggle</button>
<p>Hello</p>
<p style="display: none">Good Bye</p>
<script>
$("button").click(function () {
$("p").toggle();
});
</script>
</body>
</html>
?>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
<button>Toggle</button>
<p>Hello</p>
<p style="display: none">Good Bye</p>
<script>
$("button").click(function () {
$("p").toggle();
});
</script>
</body>
</html>
?>
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
$(document).ready(function() {
$("button").click(function () {
$(".content").toggle();
});
})
</script>
</head>
<body>
<button>Toggle</button>
<div class='content'>tekst</div>
</body>
</html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
$(document).ready(function() {
$("button").click(function () {
$(".content").toggle();
});
})
</script>
</head>
<body>
<button>Toggle</button>
<div class='content'>tekst</div>
</body>
</html>
Toevoeging op 02/04/2013 21:10:33:
je kunt de .click event aan ieder element hangen.