就像标题所说的，我在我的网站上创建了一个"FAQ"部分，人们可以点击一个象形符号，它将显示文本。这是我的代码
<div class="tab-content">
<div id="home" class="tab-pane fade in active ">
<h3>Product Specs</h3>
<ul id="questions">
<li><span id="symbol"><i class="fa fa-gg"></i></span> Do I have to use one of your templates for my vinyl banner?</li>
<li id="subtext">While we have created templates for you to use as a starting point, if you don’t want to use them and would like to design your own banner, you have three additional options. First, you can choose the blank template and start designing from scratch on our design tool. Second, you can upload your own files to make a banner. Lastly, you can contact us and have us design something for you.</li>
</ul>
</div>
</div>
当用户点击<span id="symbol">时，它将显示/隐藏
<li id="subtext">
您可以简单地使用:
$("li:nth-child(odd) span#symbol").click(function () {
$(this).closest("li").next("li").toggle();
});
如果您使用多个id，则存在根本错误。id s必须是唯一的
所以我的建议是，请将它们改为类。通过这种方式，如果您这样做，您可以这样做:
$(function () {
$(".subtext").hide();
$("li:nth-child(odd) .symbol").click(function () {
$(this).closest("li").next("li").toggle();
});
});<script src="https://code.jquery.com/jquery-1.9.1.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<div class="tab-content">
<div id="home" class="tab-pane fade in active ">
<h3>Product Specs</h3>
<ul id="questions">
<li><span class="symbol"><i class="fa fa-gg"></i></span> Do I have to use one of your templates for my vinyl banner?</li>
<li class="subtext">While we have created templates for you to use as a starting point, if you don’t want to use them and would like to design your own banner, you have three additional options. First, you can choose the blank template and start designing from scratch on our design tool. Second, you can upload your own files to make a banner. Lastly, you can contact us and have us design something for you.</li>
<li><span class="symbol"><i class="fa fa-gg"></i></span> Do I have to use one of your templates for my vinyl banner?</li>
<li class="subtext">While we have created templates for you to use as a starting point, if you don’t want to use them and would like to design your own banner, you have three additional options. First, you can choose the blank template and start designing from scratch on our design tool. Second, you can upload your own files to make a banner. Lastly, you can contact us and have us design something for you.</li>
<li><span class="symbol"><i class="fa fa-gg"></i></span> Do I have to use one of your templates for my vinyl banner?</li>
<li class="subtext">While we have created templates for you to use as a starting point, if you don’t want to use them and would like to design your own banner, you have three additional options. First, you can choose the blank template and start designing from scratch on our design tool. Second, you can upload your own files to make a banner. Lastly, you can contact us and have us design something for you.</li>
<li><span class="symbol"><i class="fa fa-gg"></i></span> Do I have to use one of your templates for my vinyl banner?</li>
<li class="subtext">While we have created templates for you to use as a starting point, if you don’t want to use them and would like to design your own banner, you have three additional options. First, you can choose the blank template and start designing from scratch on our design tool. Second, you can upload your own files to make a banner. Lastly, you can contact us and have us design something for you.</li>
<li><span class="symbol"><i class="fa fa-gg"></i></span> Do I have to use one of your templates for my vinyl banner?</li>
<li class="subtext">While we have created templates for you to use as a starting point, if you don’t want to use them and would like to design your own banner, you have three additional options. First, you can choose the blank template and start designing from scratch on our design tool. Second, you can upload your own files to make a banner. Lastly, you can contact us and have us design something for you.</li>
<li><span class="symbol"><i class="fa fa-gg"></i></span> Do I have to use one of your templates for my vinyl banner?</li>
<li class="subtext">While we have created templates for you to use as a starting point, if you don’t want to use them and would like to design your own banner, you have three additional options. First, you can choose the blank template and start designing from scratch on our design tool. Second, you can upload your own files to make a banner. Lastly, you can contact us and have us design something for you.</li>
<li><span class="symbol"><i class="fa fa-gg"></i></span> Do I have to use one of your templates for my vinyl banner?</li>
<li class="subtext">While we have created templates for you to use as a starting point, if you don’t want to use them and would like to design your own banner, you have three additional options. First, you can choose the blank template and start designing from scratch on our design tool. Second, you can upload your own files to make a banner. Lastly, you can contact us and have us design something for you.</li>
</ul>
</div>
</div>