Блог

У меня есть эта форма цитаты, которая довольно обширна… Все, что мне нужно сделать сейчас, это добавить некоторый код, который позволит вопросам оставаться видимыми, а не скрывать их после выбора.

т.е. пользователь будет находиться в любом бизнес-пути (вся таблица1,11,12,13,14,15,16), путь резидента (вся таблица2,21,22,23,24,25,26, или у меня есть путь к списку (вся таблица3).

Вот моя скрипка http://jsfiddle.net/XuVUb /

фрагмент кода:

 <script type="text/javascript">
function show_table(id){
  document.getElementById('table1').style.display='none';
  document.getElementById('table11').style.display='none';
  document.getElementById('table12').style.display='none';
  document.getElementById('table13').style.display='none';
  document.getElementById('table14').style.display='none';
  document.getElementById('table15').style.display='none';
  document.getElementById('table16').style.display='none';
  document.getElementById('table2').style.display='none';
  document.getElementById('table21').style.display='none';
  document.getElementById('table22').style.display='none';
  document.getElementById('table23').style.display='none';
  document.getElementById('table24').style.display='none';
  document.getElementById('table25').style.display='none';
  document.getElementById('table26').style.display='none';
  document.getElementById('table3').style.display='none';
  document.getElementById('table' id).style.display='block';
}
</script>
  

Я думаю, вы хотите что-то вроде этого: http://jsfiddle.net/S9bSe /

HTML:

 <div class="level-1">
    <p>Are you dead or alive?</p>
    <ul>
        <li><a href="#dead" data-level="2">Dead</a></li>
        <li><a href="#alive" data-level="2">Alive</a></li>
        <li><a href="#schrodingers_cat" data-level="2">Both</a></li>
    </ul>
    <div id="dead" class="hidden level-2">
        <p>Do you have physical form?</p>
        <ul>
            <li><a href="#corpse" data-level="3">Yes</a></li>
            <li><a href="#ghost" data-level="3">No</a></li>
        </ul>
        <div id="corpse" class="hidden level-3">
            <p>You are a corpse</p>
        </div>
        <div id="ghost" class="hidden level-3">
            <p>You are a ghost</p>
        </div>
    </div>
    <div id="alive" class="hidden level-2">
        <p>Do you have 9 lives?</p>
        <ul>
            <li><a href="#regular_cat" data-level="3">Yes</a></li>
            <li><a href="#maybe_human" data-level="3">No</a></li>
        </ul>
        <div id="regular_cat" class="hidden level-3">
            <p>You are a cat</p>
        </div>
        <div id="maybe_human" class="hidden level-3">
            <p>You might be human</p>
        </div>
    </div>
    <div id="schrodingers_cat" class="hidden level-2">
        <p>You are a cat and you belong to Schrödinger</p>
    </div>
</div>
  

CSS

 .hidden {
    display: none;
}
  

JavaScript (с помощью jQuery)

 $("a").on("click", function () {
    var id = $(this).attr("href");
    var level = $(this).data("level");
    $(".level-"   level).addClass("hidden");
    $(id).removeClass("hidden");
});
  

Пожалуйста, извините меня за введение jQuery, но это должно, по крайней мере, прояснить, как можно решить проблему.