显示/隐藏代码出现问题,第二级

时间:2019-02-19 21:22:51

标签: javascript jquery html hide show

我一生都无法弄清为什么Sub1和Sub2下的文本在单击它们时不显示其下的文本。仅第一个链接“主要类别”起作用。尽管已经尽我所能解释了这个问题,但这使我输入了更多的描述。

<!DOCTYPE html>
<?php 
session_start();
print "
<html>
</head>
<body>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
#body {
font-family: 'Helvetica', Arial, sans-serif;
display:none;
width: 100%;
padding: 5px 0;
text-align: left;
background-color: lightblue;
margin-top: 5px;}
</style>
</head>
<body>
<div id="body12">
<a href='#' class='articleTitle'><font size="+1">Main Category</font></a>
<div class='showArticle'>
<a href='#' class='commentsTitle'><font size="+1">Sub1</font></a>
<div class='showComments'>
<font size="+1" color="red"><b>Text1</b></font>
</div><br>
<a href='#' class='commentsTitle'><font size="+1">Sub2</font></a>
<div class='showComments'>
<font size="+1" color="red"><b>Text2</b></font>
</div></div><br>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'>
$(document).ready(function(){

$('.showArticle').hide();
$('.articleTitle').show();

$('.showComments').hide();
$('.commentTitle').show();

$('.articleTitle').click(function(e){
$(this).next('.showArticle').slideToggle();
e.preventDefault();
});

$('.commentTitle').click(function(e){
$(this).next('.showComments').slideToggle();
e.preventDefault();
});
});
</script>
</body>
</html>

1 个答案:

答案 0 :(得分:0)

您的JS var uiobject = {}; uiobject.name = "options[foo][bar]"; var objectvalue = ""; var props = uiobject.name.replace(/\]/g, '').split('['); var temp = {options:{foo:{bar:"baz"}}}; for(var z=0;z<props.length;z++) { if(!temp.hasOwnProperty[ (props[z]) ]) { if(z == (props.length - 1)) { objectvalue = temp[ props[z] ]; } else { temp = temp[ (props[z]) ]; } } } console.log("value: "+objectvalue);中有错字 在html中,您为类$('.commentsTitle').click(...指定了commentsTitle

commentTitle
$(document).ready(function(){

$('.showArticle').hide();
$('.articleTitle').show();

$('.showComments').hide();
$('.commentsTitle').show();

$('.articleTitle').click(function(e){
$(this).next('.showArticle').slideToggle();
e.preventDefault();
});

$('.commentsTitle').click(function(e){
$(this).next('.showComments').slideToggle();
e.preventDefault();
});
});