Javascript-CSS show and hide form elements

Using Javascript, how to show and hide some parts of the table (for example: TR or TD). This should work depending on the data retrieved from the database. I use CakePHP framework for my application and use one view file for adding and editing. In edit mode. Depending on the selected data, I need to show and hide some parts of the form elements.

Scenario There are five questions: A, B, C, D nad EB depends on A, C depends on B, D depends on C and E depends on D Therefore, adding that I have hidden B, C, D and E when choosing Related questions will display other questions. A, B, C, D - all are yes / no questions (switches).

For instance:

<'table>
<'tr id='a'>
  <'td colspan='2'>A<'/td>
<'/tr>  
<'tr id='b'>
  <'td colspan='2'>B<'/td>
<'/tr>
<'tr id='cd'>
  <'td id='c'>C<'/td><'td id='d'>D<'/td>
<'/tr>
<'/table>

('Prefix for all HTML tags)

. , .

+5
4

CSS , - display, - visibility.

, none block. none hide, block . none, , HTML- CSS. block, HTML- .

, hidden visible. hidden , block , , .

, , (), . , CSS visibility hidden , , ​​ , , . , () . , visible, .

JavaScript display:

document.getElementById(id).style.display = "none";
document.getElementById(id).style.display = "block";

visibility:

document.getElementById(id).style.visibility= "hidden";
document.getElementById(id).style.visibility= "visible";

, , , , . , , .

, , innerHTML .

+12

, (.. , ), style.visibility "". , "".

.

var el = document.getElementById('a');
a.style.visibility = 'hidden';
a.style.visibility = 'visible';

(.. , , ) style.display "none". ( , ), "" ( ).

var el = document.getElementById('a');
a.style.display = 'none';
a.style.display = '';

, , ( , ).

+2

jQuery: ("#b").css("display","none"); ("#b").css("display","block");

jQuery, quirksmode.org.

+1

, . , jQuery, / - - hide(), show() toggle(), : ("#b").hide(); or ("#b").show(); or ("#b").toggle();

toggle() . . : http://api.jquery.com/hide/

jQuery - . stackoverflow , , , , - .

0

All Articles