Bruce Gust
asked on
What am I doing wrong with this JQuery thing that's supposed to hide my class?
Head out to http://brucegust.com/portfolio/calendar/body.php
Here's my code:
I want to create a series of functions that hide various classes embedded throughout my page. What you see is my best effort and I'm falling short. What am I missing.
Basically, what I need is that the page starts with the box checked and the class is visible. Should a user "un-click" it, the class is hidden. If they click it, it's revealed again.
How do I pull that off?
Here's my code:
<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>Javascript</title>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<table style="border-spacing:0; border-collapse:collapse;">
<tr>
<td style="padding:0xp;">CATN</td>
<td style="text-align:right; padding:0px;"><input type="checkbox" value="Y" name="CTX" checked id="CATN_button" onchange="CATN();"> </td>
</tr>
</table>
<br>
<div class="CATN_long">hello</div>
<script>
$('#CATN_button').change(function(){
var v = this.checked ? 'show' : 'hide';
$('CATN_long').v();
}
</script>
</body>
</html>
I want to create a series of functions that hide various classes embedded throughout my page. What you see is my best effort and I'm falling short. What am I missing.
Basically, what I need is that the page starts with the box checked and the class is visible. Should a user "un-click" it, the class is hidden. If they click it, it's revealed again.
How do I pull that off?
ASKER
kiranvj...
Tried it and I'm still missing something. Check out the updated code at http://brucegust.com/portfolio/calendar/body.php and tell me where I'm going south.
Tried it and I'm still missing something. Check out the updated code at http://brucegust.com/portfolio/calendar/body.php and tell me where I'm going south.
My bad, syntax error
Play with the code here
$('#CATN_button').change(function(){
if($(this).is(':checked') ) {
$('.CATN_long').show();
}
else {
$('.CATN_long').hide();
}
});
Play with the code here
ASKER
Sweet!
One more thing, if you don't mind:
When I try to duplicate your code, I run into problems. In other words, I now have two divs and two different checkboxes. Take a look at what I've got at http://brucegust.com/portfolio/calendar/body.php if you would, and tell me what I need to be sensitive to in order to replicate your magic over several similar scenarios.
One more thing, if you don't mind:
When I try to duplicate your code, I run into problems. In other words, I now have two divs and two different checkboxes. Take a look at what I've got at http://brucegust.com/portfolio/calendar/body.php if you would, and tell me what I need to be sensitive to in order to replicate your magic over several similar scenarios.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Perfect!
Open in new window