I don't know why this code won't work but when I check the checkbox it won't work. The div just remains hidden. I have done this before but this time it won't work.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<%@ Page Language="C#" %>
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="WebPartPageExpansion" content="full" />
<meta charset="utf-8">
<title>jQuery Show Hide Using Checkboxes</title>
<script type="text/javascript" src="../SiteAssets/jquery-1.11.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('input[type=checkbox]').change(function(){
var checked = $(this).attr('checked');
if (checked) {
$('.other').show();
} else {
$('.other').hide();
}
});
});
</script>
</head>
<body>
<div name="main">
<input type="checkbox" /> If this is checked display div
</div>
<div class='other' name='other' title='other' style='display:none;'>
<h2>test</h2>
<input></input>
<input></input>
<input></input>
</div>
</body>
</html>
What am I doing wrong? I can't figure this out. Thanks.
As there is no attribute checked
in checkbox. So it is returning undefined .You can directly access the property by this.checked
.
$(document).ready(function(){
$('input[type=checkbox]').change(function(){
var checked = this.checked;
if (checked) {
$('.other').show();
} else {
$('.other').hide();
}
});
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.