顯示單選按鈕時下拉項選擇

當訪問者點擊下拉列表中的所有項，四個單選按鈕必須看到。

這是下拉列表中的HTML代碼：

<div class="xmp-form-row "> 
    <Label CssClass="xmp-form-label" For="wijzigingOpvangVestiging">Vestiging waar uw kind geplaatst is</Label> 
    <DropDownList Id="wijzigingOpvangVestiging" DataField="wijzigingOpvangVestiging" DataSourceId="dsLocaties" DataTextField="Vestiging" DataValueField="Vestiging" DataType="string" AppendDataBoundItems="True"> 
     <ListItem Value="niet geselecteerd">(Selecteer een vestiging)</ListItem> 
    </DropDownList> 
</div>

這是單選按鈕的代碼德：

<div class="xmp-form-row radioButtonCheckfirst locationRB"> 
    <Label CssClass="xmp-form-label" For="wijzigingReden">Reden beeindiging</Label>    
    <radiobuttonlist id="wijzigingReden" datafield="wijzigingReden" RepeatDirection="Vertical" RepeatLayout="Table" datatype="string"> 
     <listitem value="Uitbreiding van dagen-uren"> Uitbreiding van dagen/uren </listitem> 
     <listitem value="Gedeeltelijke opzegging"> Gedeeltelijke opzegging </listitem> 
     <listitem value="Wijziging van vestiging"> Wijziging van vestiging </listitem> 
     <listitem value="Wijziging van dagen"> Wijziging van dagen </listitem> 
    </radiobuttonlist>          
</div>

來源

2012-10-31 BlueBay

什麼你有問題嗎？目前發生了什麼問題？ – Lodder

如果我們的答案之一有幫助，請將其設置爲您的解決方案。謝謝！ –

我建議你塗change事件綁定到你的下拉列表。 docs

來源

2012-10-31 12:11:33

嘗試這樣的事情...

<DropDownList onchange="document.getElementById('wijzigingReden').style.display = ''" Id="wijzigingOpvangVestiging" DataField="wijzigingOpvangVestiging" DataSourceId="dsLocaties" DataTextField="Vestiging" DataValueField="Vestiging" DataType="string" AppendDataBoundItems="True"> 
     <ListItem Value="niet geselecteerd">(Selecteer een vestiging)</ListItem> 
    </DropDownList>

，並設置單選按鈕是在頁面加載顯示沒有。

<radiobuttonlist style="display: none" id="wijzigingReden" datafield="wijzigingReden" RepeatDirection="Vertical" RepeatLayout="Table" datatype="string"> 
     <listitem value="Uitbreiding van dagen-uren"> Uitbreiding van dagen/uren </listitem> 
     <listitem value="Gedeeltelijke opzegging"> Gedeeltelijke opzegging </listitem> 
     <listitem value="Wijziging van vestiging"> Wijziging van vestiging </listitem> 
     <listitem value="Wijziging van dagen"> Wijziging van dagen </listitem> 
    </radiobuttonlist>

希望這會有所幫助！

來源

2012-10-31 12:12:11

謝謝你們！但任何人都可以用http://jsfiddle.net舉個例子嗎？ – BlueBay

安德魯感謝你的支持。事情是，我在控制檯（firebug）中獲得下一條消息：showDiv沒有被定義。 – BlueBay

我的代碼不使用showDiv函數。我的例子只是使用內聯代碼... onchange =「document.getElementById（'wijzigingReden'）。style.display =''」 –

<div id="dropDownDiv" class="xmp-form-row " onChange="showDiv()"> 
     <Label CssClass="xmp-form-label" For="wijzigingOpvangVestiging">Vestiging waar uw kind geplaatst is</Label> 
     <DropDownList Id="wijzigingOpvangVestiging" DataField="wijzigingOpvangVestiging" DataSourceId="dsLocaties" DataTextField="Vestiging" DataValueField="Vestiging" DataType="string" AppendDataBoundItems="True"> 
      <ListItem Value="niet geselecteerd">(Selecteer een vestiging)</ListItem> 
     </DropDownList> 
    </div> 

<radiobuttonlist id="wijzigingReden" datafield="wijzigingReden" RepeatDirection="Vertical" RepeatLayout="Table" datatype="string" style="display: none"> 
     <listitem value="Uitbreiding van dagen-uren"> Uitbreiding van dagen/uren </listitem> 
     <listitem value="Gedeeltelijke opzegging"> Gedeeltelijke opzegging </listitem> 
     <listitem value="Wijziging van vestiging"> Wijziging van vestiging </listitem> 
     <listitem value="Wijziging van dagen"> Wijziging van dagen </listitem> 
    </radiobuttonlist> 

<script type="text/javascript"> 
    function showDiv(){ 
     if(document.getElementById('wijzigingReden').style.display == "block"){ 
      document.getElementById('wijzigingReden').style.display = "none"; 
     } 
     else{ 
      document.getElementById('wijzigingReden').style.display = "block"; 
     } 
</script>

來源

2012-10-31 12:20:59

它在我的Firefox中工作正常 –

請參閱編輯答案隱藏/顯示單選按鈕 –

Thanls for information guys！但是有沒有辦法只以非本地方式來做到這一點。所以只能用jQuery？ – BlueBay

添加一個CSS類「隱藏」的單選按鈕封閉的div，最初隱藏按鈕/標籤，然後使用jQuery ...這裏

$("#wijzigingOpvangVestiging").change(function() { 
    $("#nameoftheradiobuttondiv").removeClass("hidden"); 
});

小提琴...... http://jsfiddle.net/Z5nNW/2/

來源

2012-10-31 12:21:09 pswillies

更新爲小提琴鏈接 – pswillies

顯示單選按鈕時下拉項選擇

回答

相關問題