jQuery选择器在单击时删除CSS
[英]Jquery selector to remove css on click
问题描述
I can not get hold of the right selector. 
我无法掌握正确的选择器。 I tried all kind of stuff. 我尝试了各种东西。
If I click on class navclick I want ONLY the next tr class to remove css class navdisplaynone. 如果我单击类navclick，则只希望下一个tr类删除css类navdisplaynone。
$(".navclick").click(function(){
$(this).parent().next("tr").removeClass("navnone");
});
For your information : navdisplaynone is css class with rule : display:none; 供您参考：navdisplaynone是具有规则的css类：display：none;
<table class="table table-striped table-bordered" id="navtable">
<thead>
<tr id="pcatid1">
<th class="navclick">Software</th>
</tr>
<tr class="navdisplaynone" id="catid1">
<th class="navclick">Windows</th>
</tr>
<tr id="pcatid2">
<th class="navclick">Hardware</th>
</tr>
<tr class="navdisplaynone" id="catid2">
<th class="navclick">Mouse</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
2 个解决方案
解决方案1
0 2014-12-20 19:04:37
Check http://jsfiddle.net/gbuqond5/ 检查http://jsfiddle.net/gbuqond5/
Try this 尝试这个
$(document).ready( function(){
$(".navclick").click(function(e){
$(this).parent().next("tr").removeClass("navdisplaynone");
});
});
Assuming your class was navdisplaynone Replace 'navdisplaynone' by 'navnone' in case that's the class. 假设您的班级是navdisplaynone，如果是该班级，请将“ navdisplaynone”替换为“ navnone”。
Note: In case of a menu, you might want to toggle the class instead of remove. 注意：如果使用菜单，则可能要切换类而不是删除类。
解决方案2
0 已采纳 2014-12-20 19:13:15
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<link rel="stylesheet" href="">
<style type="text/css">
.navdisplaynone{
display: none;
}
</style>
</head>
<body >
<table class="table table-striped table-bordered" id="navtable">
<thead>
<tr id="pcatid1">
<th class="navclick">Software</th>
</tr>
<tr class="navdisplaynone" id="catid1">
<th class="navclick">Windows</th>
</tr>
<tr id="pcatid2">
<th class="navclick">Hardware</th>
</tr>
<tr class="navdisplaynone" id="catid2">
<th class="navclick">Mouse</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</body>
<script src="js/jquery-2.1.1.min.js"></script>
<script type="text/javascript">
$(".navclick").click(function(){
$(this).parent().next("tr").removeClass("navdisplaynone");
});
</script>
</html>
</head>
This work properly 这个工作正常
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.