свертывание формы с помощью JavaScript

Question

Возможно ли с помощью javascript и без использования такой инфраструктуры, как jquery, иметь простую форму со списком флажков или переключателей, а если выбран конкретный, развернуть, чтобы показать дополнительные флажки / переключатели?

Answer 1

<input ... onclick="toggleDetails(this);" />
<div id='detailsView' style='display:none'gt;
    content to display when checked
</div>

... script ...

function toggleDetails(chk) {
  document.getelemantById('detailsView').style.display = 
    chk.checked ? "block" : "none";
}

Честно говоря, использование фреймворка, такого как jQuery, в конечном итоге было бы лучше.

Answer 2

Все, что вы можете сделать в любой среде, которую вы можете сделать без рамки.

Каркасы во многих случаях облегчают работу, поэтому вам не придется заниматься тяжелой работой.

То, что вы, вероятно, захотите сделать, - это просто иметь обработчик события onclick на каждом флажке или переключателе, и, когда он будет нажат, создайте новый div и заполните его дополнительной информацией, или, если эта информация уже была заполнено и было просто скрыто с помощью css, а затем обработчик события сделает его видимым.

Есть много способов сделать то, что вы предлагаете, в зависимости от вашего видения юзабилити.

Answer 3

Да, это возможно, но гораздо больше работы, чем делать это с фреймворком. Вам нужно написать код обхода DOM, чтобы найти элементы в форме, код привязки события, чтобы связать функции с событиями для элементов формы (это отличается в IE и не в IE), а затем использовать свойство style.display для sub. -элементы, чтобы скрыть или показать их.

Если вы хотите узнать больше, Quirksmode.org содержит некоторые из лучших объяснений базового JavaScript, который я нашел.

Answer 4

Конечно, используя события onChange и манипуляции с dom ... Также вы можете подумать о написании своих собственных анимаций, но на самом деле, почему так много сообществ сделали эту работу за вас.