控制具有相同类的单个DIVs的jQuery (兄弟？)
控制具有相同类的单个DIVs的jQuery (兄弟？)
提问于 2008-11-04 11:25:59
我正在为我的网站建立一个常见问题解答模块，我希望能够控制页面上的单个元素，即使它们都有相同的类。我相信这属于我还不熟悉的兄弟姐妹。
基本上，我希望用户能够单击问题div，然后当他们单击它时，与问题div相同的div中的答案div将被设置为显示(如果这是有意义的！)。任何帮助都将不胜感激。
<div class="set">
<div class="question">What is the airspeed velocity of an unladen swallow?</div>
<div class="answer">Although a definitive answer would of course require further measurements, published species-wide averages of wing length and body mass, initial Strouhal estimates based on those averages and cross-species comparisons, the Lund wind tunnel study of birds flying at a range of speeds, and revised Strouhal numbers based on that study all lead me to estimate that the average cruising airspeed velocity of an unladen European Swallow is roughly 11 meters per second, or 24 miles an hour. </div>
</div>
<div class="set">
<div class="question">What is the airspeed velocity of an unladen swallow?</div>
<div class="answer">Although a definitive answer would of course require further measurements, published species-wide averages of wing length and body mass, initial Strouhal estimates based on those averages and cross-species comparisons, the Lund wind tunnel study of birds flying at a range of speeds, and revised Strouhal numbers based on that study all lead me to estimate that the average cruising airspeed velocity of an unladen European Swallow is roughly 11 meters per second, or 24 miles an hour. </div>
</div>
<div class="set">
<div class="question">What is the airspeed velocity of an unladen swallow?</div>
<div class="answer">Although a definitive answer would of course require further measurements, published species-wide averages of wing length and body mass, initial Strouhal estimates based on those averages and cross-species comparisons, the Lund wind tunnel study of birds flying at a range of speeds, and revised Strouhal numbers based on that study all lead me to estimate that the average cruising airspeed velocity of an unladen European Swallow is roughly 11 meters per second, or 24 miles an hour. </div>
</div>回答 2
Stack Overflow用户
回答已采纳
发布于 2008-11-04 11:35:14
如果我正确理解了您的问题，您应该首先将所有答案设置为隐藏在css：.answer {display:none;}中。
然后，您可以使用jquery显示所单击问题的正确答案：
$(document).ready ( function () {
$('.question').click(function() {
$(this).next('.answer').show();
});
});编辑:您也可以使用.toggle()而不是.show()来显示/隐藏。
Stack Overflow用户
发布于 2008-11-04 11:35:28
你可能应该看看这个question，它做了一些类似的事情。
基本上，您首先需要为您的元素设置ID，以便您可以在集合类中标识单个元素。
然后，您可以添加一个click事件处理程序，该处理程序将设置选定的项并显示相应的答案。
您可以在documentation here中看到抓取同级的语法。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/261572
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号