0

みなさん、もう一度スクリプトの問題が発生しました。投稿でメンバーのプロファイルデータに対してjQueryの表示/非表示を実行しています。http://www.pimpkings.com/t3-what-up-everyoneにアクセスして、私が話していることを確認してください。コードをオンのままにして、コードが何をしているのかを確認できるようにします。

1人の表示/非表示をクリックするたびに、すべての人が開きます。ユーザーの要求に応じて1人だけ開くようにします。

コードは-

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".slidingDiv").hide();
 $(".show_hide").show();
    $('.show_hide').click(function(){

$(".slidingDiv").slideToggle();

});

});
</script>

次に、htmlコーディングは

<span class="show_hide" style="cursor:pointer;color:#c0c0c0;">Show/hide</span>
<div class="slidingDiv">
                              <!-- BEGIN profile_field -->
                            <center>    {postrow.displayed.profile_field.LABEL} <center/>
                            <center>  {postrow.displayed.profile_field.CONTENT} <center/>
                            <center>  {postrow.displayed.profile_field.SEPARATOR}<center/>
                            <!-- END profile_field -->
                            <center>{postrow.displayed.profile_field.LABEL}<center/>
                            <center>Online Status<center/><br/>
                            <center>{postrow.displayed.ONLINE_IMG}<center/>
                                        {postrow.displayed.POSTER_RPG} <br />

                            <!-- BEGIN contact_field -->
                             <br/> <br/>
                            {postrow.displayed.PROFILE_IMG} {postrow.displayed.PM_IMG}  
                            {postrow.displayed.EMAIL_IMG} {postrow.displayed.contact_field.CONTENT}
                            <!-- END contact_field -->
                              <span class="show_hide" style="cursor:pointer;color:#c0c0c0;">hide</span></div>
                            </span>

誰かが別のセレクターを見つけて、一度に開かないようにするのを手伝ってもらえますか？

4

1 に答える 1

0

これを試して：

$(document).ready(function() {
    $(".slidingDiv").hide();
    $(".show_hide").show();
    $('.show_hide').click(function() {
        $(this).next(".slidingDiv").slideToggle();
    });
});​

プロファイルの最後にある「非表示」リンクのクラスを別のクラスに変更する必要があることに注意してください（たとえば、非表示にするだけです）。これにより、jQueryでより簡単にターゲットを設定して、プロファイルを非表示にできます。

ああ、もう1つ、<center>タグはかなり前に非推奨になりました。代わりにCSSを使用して中央に配置します。

jsFiddleの例

于 2012-09-08T16:50:21.710 に答える