選択タグを隠すには？

私はこの単純な形式があります。選択タグを隠すには？

<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>

を、私は私が最初に「少年」をクリックすると、このブロックを選択することを望むが。消えるまで持っている：

<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>

私はCSSでこれを行うことができます？そうでなければ、私はjavascriptでこれを行うことができますか？すべての今

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

：

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

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

はちょうどあなたのtdを持っていることを確認してくださいJavaScriptで

出典

2010-12-12 xRobot

CSS、 JavaScript、はい。それはバニラJavaScriptである必要がありますか、またはあなたはライブラリ（jQuery、MooTools、Prototype、Scriptaculous、Glow ..など）を使用するのに適していますか？ –

あなたはCSSでこれを行うことはできませんが、あなたができるid=earringstd

次に、関数を作成します性別選択タグを次のように変更する必要があります。

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

出典

2010-12-12 18:21:55

clumsy、 'gender.form.earring.style.visibility = 'hidden''はジョブを実行します –

私はこれを試しましたが動作しません：http://gooworld.altervista.org/ – xRobot

おそらく構文エラーか私のコードでは、私は頭の上からそれをタイプしました –

hiddenプロパティはselectを隠しますが、タグは引き続きレンダリングされ、ページ上のスペースを占有します。私は、これは古いです知っているが、私

<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>

出典

2014-02-18 15:10:37

：

あなたが選択を隠していない、それはまったく表示させたいが、それでもDOMと対話することができるようにしたい場合は

は、ここではいくつかのサンプルコードです私は次のようにGoranコードを変更し、私が共有すると考えました。これは、ページ上のスペースを保持しないようにコードを崩壊しますが、上記のコードはフォームを保持し続けますが、目に見えなくなります。

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

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

出典

2014-11-14 18:25:34 Crystal

答えて

関連する問題