2016-07-25 2 views
1

このJSFiddleに表示されるコンテンツの基本的な表示/非表示切り替えがあります。その仕事はすばらしく、私はそれが必要なのです。別のページからdivに固定するときにテキストを切り替える

しかし、私がやっていることは、別のページからこれらのdivに固定して、表示する回答divをトリガーすることです。私は以下のコードでうまく動作していますが、上記の手動切り替えに影響を与えることなく、別のページから来たときにテキストを閉じる(これも切り替える)に変更するのに苦労しています。

私はいくつかのことを試しましたが、正しく動作していなかったので、私のコードを元に戻して、うまくはっきりとわかりました。私が抱えていた主な問題の1つは、ページ上の同じクラスのすべてのdivを有効にするのではなく、特定のdivのテキストを変更することだけでした。以下

コード:

<div id="anchorid1" class="question__wrapper"> 
    <div class="question__item"> 
    <p> 
    What sort of question am i one? 
    </p> 
    <div class="view__answer"> 
     <div class="view__answer-btn">View Answer</div> 
    </div> 
    </div> 
    <div class="answer__wrapper"> 
    <div class="answer__item"> I'm the answer that is hidden</div> 
    </div> 
</div> 

<div id="anchorid2" class="question__wrapper"> 
    <div class="question__item"> 
    <p> 
    What sort of question am i two? 
    </p> 
    <div class="view__answer"> 
     <div class="view__answer-btn">View Answer</div> 
    </div> 
    </div> 
    <div class="answer__wrapper"> 
    <div class="answer__item"> I'm the answer that is hidden</div> 
    </div> 
</div> 



$(document).ready(function() { 
    $('.view__answer-btn').on('click', function(e){ 
    $(e.target).parents().next('.answer__wrapper').slideToggle(500, function() {}); 
    $(e.target).toggleClass('open'); 

    if ($(e.target).hasClass('open')) { 
     $(this).html('Close Answer'); 
    } else { 
     $(this).html('View Answer'); 
    } 
}); 
}); 



$(function() { 
    var anc = window.location.href.split('#')[1]; 
    $('#' + anc + '.question__wrapper').find('.answer__wrapper').show(); 
}); 
+0

いくつかのHTMLコードを投稿できますか? –

+0

jsフィドルではHTMLが、ここでもそれを置いています。ありがとう – probablybest

答えて

1

多分これは動作します!愚かなくぼみを許してください。

$(function() { 
    var anc = window.location.href.split('#')[1]; 
    $('#' + anc + '.question__wrapper').find('.answer__wrapper') 
             .show() 
             .prev().find('.view__answer-btn') 
             .addClass('open') 
             .html('Close Answer'); 
}); 
関連する問題