Come nascondere un tag select?

Ho questa semplice forma:Come nascondere un tag select?

<form method="post" action="index.php" > 
<table> 

<tr> 
<td> 
Sex: 
</td> 
<td> 
    <select name="sex" > 
    <option value="e">Select </option> 
    <option value="girl">Girl </option> 
    <option value="boy">Boy </option> 
    </select> 
</td> 
</tr> 

<tr> 
<td> 
Accessories: 
</td> 
<td> 
    <select name="earrings" > 
    <option value="e">Select </option> 
    <option value="gold">gold </option> 
    <option value="silver">silver </option> 
    </select> 
</td> 
</tr> 


</table> 

<br> 
<input type="submit" size="10" value="Go" name="go"> 
</form>

e voglio che quando clicco su "ragazzo" nella prima selezionare, quindi questo blocco deve scompare:

<tr> 
<td> 
Accessories: 
</td> 
<td> 
    <select name="earrings" > 
    <option value="e">Select </option> 
    <option value="gold">gold </option> 
    <option value="silver">silver </option> 
    </select> 
</td> 
</tr>

posso fare questo con i CSS ? In caso contrario, posso farlo con javascript?

fonte

2010-12-12 xRobot

CSS, no; JavaScript, si. Ha bisogno di essere un vaniglia JavaScript, o saresti in grado di usare una libreria (come jQuery, MooTools, Prototype, Scriptaculous, Glow ..)? –

Non si può fare questo in CSS, ma è possibile in JavaScript

function hide(){ 
var earrings = document.getElementById('earringstd'); 
earrings.style.visibility = 'hidden'; 
} 

function show(){ 
var earrings = document.getElementById('earringstd'); 
earrings.style.visibility = 'visible'; 
}

Basta fare in modo che il vostro td ha id=earringstd

Quindi creare la funzione:

function genderSelectHandler(select){ 
if(select.value == 'girl'){ 
show(); 
}else if(select.value == 'boy'){ 
hide(); 
}}

Ora tutto devi cambiare il tuo tag select di genere su:

<select name="sex" onchange="genderSelectHandler(this)">

fonte

2010-12-12 18:21:55

goffo, 'gender.form.earring.style.visibility = 'hidden'' fa il lavoro –

Ho provato questo, ma non funziona: http://gooworld.altervista.org/ – xRobot

Probabilmente c'è un errore di sintassi o alcuni nel mio codice, l'ho digitato dalla cima della mia testa –

La proprietà nascosta nasconde la selezione ma il tag viene ancora visualizzato e occupa spazio sulla pagina.

Se si vuole nascondere una selezione e non vuole che appaia a tutti, ma ancora in grado di interagire con il DOM, ecco alcuni esempi di codice:

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<title></title> 

<script type="text/javascript"> 

     function hide(){ 
      var elem = document.getElementById('sel1'); 
      elem.style.display = 'none'; 
     } 

     function show(){ 
      var elem = document.getElementById('sel1'); 
      elem.style.display = 'inline'; 
     } 

</script> 

</head> 
<body> 
    <form id="form1" runat="server"> 

     <select id='sel1' style='display:inline;'/> 

     <input type="button" onclick="show();" value="Show"></input><br> 
     <input type="button" onclick="hide();" value="Hide"></input><br> 

    </form> 
</body> 
</html>

fonte

2014-02-18 15:10:37

So che questo è un vecchio, ma io codice Goran alterato come elencato di seguito e ho pensato di condividere. Questo collassa il codice in modo che non mantenga lo spazio sulla pagina, mentre il codice sopra elencato continua a mantenere la sua forma ma diventa invisibile.

function genderSelectHandler(select){ 
if(select.value == 'girl'){ 
$("#earringstd").show() 
}else{ 
$("#earringstd").hide(); 
}} 

<select name="sex" onchange="genderSelectHandler(this)">

fonte

2014-11-14 18:25:34 Crystal

Come nascondere un tag select?

risposta

Problemi correlati