Ближайший div с конкретным классом - PullRequest
0 голосов
/ 01 апреля 2011

У меня работает скрипт, который переключает один div с другим, когда вы нажимаете на вопрос. Но это предназначается для каждого div с этим классом. Есть ли способ нацелиться на ближайший div, чтобы при нажатии на вопрос переключался только соответствующий ответ?

<a class="faqquestion">The question goes here so it does?</a>  
<p class="answer1">This is the answer and Im an absolute GENIUS!!!! This is the answer and Im an absolute GENIUS!!!! This is the answer and. This is the answer and Im an.....</p>  
<p class="answer2 hidden">uyigfiau faewiugfiaw ef iawugfi uwa fiwafiu wgaifbwaifg iuwagfiuawebfiu gwaiefgiuwagfuiaw gifgaiwfg iuaw gfiuwaifg iuawgfiuawgiufagwiug afwigu. uyigfiau faewiugfiaw ef iawugfi uwa fiwafiu wgaifbwaifg iuwagfiuawebfiu gwaiefgiuwagfuiaw gifgaiwfg iuaw gfiuwaifg iuawgfiuawgiufagwiug afwigu. uyigfiau faewiugfiaw ef iawugfi uwa fiwafiu wgaifbwaifg iuwagfiuawebfiu gwaiefgiuwagfuiaw gifgaiwfg iuaw gfiuwaifg iuawgfiuawgiufagwiug afwigu. uyigfiau faewiugfiaw ef iawugfi uwa fiwafiu wgaifbwaifg iuwagfiuawebfiu gwaiefgiuwagfuiaw gifgaiwfg iuaw gfiuwaifg iuawgfiuawgiufagwiug afwigu.<br /><br />  


uyigfiau faewiugfiaw ef iawugfi uwa fiwafiu wgaifbwaifg iuwagfiuawebfiu gwaiefgiuwagfuiaw gifgaiwfg iuaw gfiuwaifg iuawgfiuawgiufagwiug afwigu.uyigfiau faewiugfiaw ef iawugfi uwa fiwafiu wgaifbwaifg iuwagfiuawebfiu gwaiefgiuwagfuiaw gifgaiwfg iuaw gfiuwaifg iuawgfiuawgiufagwiug afwigu.uyigfiau faewiugfiaw ef iawugfi uwa fiwafiu wgaifbwaifg iuwagfiuawebfiu gwaiefgiuwagfuiaw gifgaiwfg iuaw gfiuwaifg iuawgfiuawgiufagwiug afwigu.
</p>  


<a class="faqquestion">The question goes here so it does?</a>  
<p class="answer1">This is the answer and Im an absolute GENIUS!!!! This is the answer and Im an absolute GENIUS!!!! This is the answer and. This is the answer and Im an.....</p>  
<p class="answer2 hidden">uyigfiau faewiugfiaw ef iawugfi uwa fiwafiu wgaifbwaifg iuwagfiuawebfiu gwaiefgiuwagfuiaw gifgaiwfg iuaw gfiuwaifg iuawgfiuawgiufagwiug afwigu. uyigfiau faewiugfiaw ef iawugfi uwa fiwafiu wgaifbwaifg iuwagfiuawebfiu gwaiefgiuwagfuiaw gifgaiwfg iuaw gfiuwaifg iuawgfiuawgiufagwiug afwigu. uyigfiau faewiugfiaw ef iawugfi uwa fiwafiu wgaifbwaifg iuwagfiuawebfiu gwaiefgiuwagfuiaw gifgaiwfg iuaw gfiuwaifg iuawgfiuawgiufagwiug afwigu. uyigfiau faewiugfiaw ef iawugfi uwa fiwafiu wgaifbwaifg iuwagfiuawebfiu gwaiefgiuwagfuiaw gifgaiwfg iuaw gfiuwaifg iuawgfiuawgiufagwiug afwigu.<br /><br />  


uyigfiau faewiugfiaw ef iawugfi uwa fiwafiu wgaifbwaifg iuwagfiuawebfiu gwaiefgiuwagfuiaw gifgaiwfg iuaw gfiuwaifg iuawgfiuawgiufagwiug afwigu.uyigfiau faewiugfiaw ef iawugfi uwa fiwafiu wgaifbwaifg iuwagfiuawebfiu gwaiefgiuwagfuiaw gifgaiwfg iuaw gfiuwaifg iuawgfiuawgiufagwiug afwigu.uyigfiau faewiugfiaw ef iawugfi uwa fiwafiu wgaifbwaifg iuwagfiuawebfiu gwaiefgiuwagfuiaw gifgaiwfg iuaw gfiuwaifg iuawgfiuawgiufagwiug afwigu.
</p>  


<script>  
$(document).ready(function(){  
    $(".faqquestion").click(function () {  
      $('p.answer2').toggleClass('hidden');  
      $('p.answer1').toggleClass('hidden')  
    });  
});  
</script>

Ответы [ 2 ]

2 голосов
/ 01 апреля 2011

Поскольку вы на самом деле не используете ссылки, нет реальной причины использовать <a>. Вы можете использовать div, как это:

HTML

<div class="faqquestion">Question One?</div>  
<div class="answer1">Answer one</div>  
<div class="answer2 hidden">Answer two</div>

<div class="faqquestion">Question Two?</div>  
<div class="answer1">Answer one</div>  
<div class="answer2 hidden">Answer two</div>

<div class="faqquestion">Question Three?</div>  
<div class="answer1">Answer one</div>  
<div class="answer2 hidden">Answer two</div>

JQuery

$().ready(function () {
    $("div.faqquestion").click(function () {
        $(this).next("div.answer1").toggle().next("div.answer2").toggle();
     });
});
1 голос
/ 01 апреля 2011

Если бы я мог дать ответ в jQuery, вы можете перейти к ближайшему с помощью функции next () в jQuery.

, поэтому вам придется искать jQuery ("elementSel"). Next ("div"));

в простом javascript вам придется искать методы обхода dom, а проблеск вашего html может помочь найти точный ответ.

...