簡體   English   中英

如何基於先前選擇的單選按鈕動態隱藏單選按鈕?

[英]How to dynamically hide the radio buttons based on the previously selected radio buttons?

因此,單選按鈕的某些部分采用以下方式

第1節

收音機1收音機2收音機3

SECTION2

Radio4 Radio5

SECTION3

收音機6收音機7收音機8收音機9

假設選擇了Radio2。 現在,我必須立即隱藏整個SECTION3單選按鈕。 我應該如何實施呢? 當前存在的代碼是:

.form-group(ng-repeat="attribute in object.attributes" style="position: relative; float: left;")
    label.control-label {{attribute}}
    ul.option-list
          li(ng-repeat="x in object[attribute] | orderBy: 'x'")
              .radio
                  label
                      input.btn(type="radio", ng-model="product[attribute]", ng-value="x", ng-selected)
                      | {{x}}

這里的名稱SECTION1SECTION2等來自屬性,而單選按鈕的名稱則來自對象中的x [attribute]

任何幫助將非常感激。 提前致謝。

更新:

在這里,我僅在選擇一個區域中的特定單選按鈕時才嘗試隱藏單選按鈕的另一部分。 如果選擇了第1部分的單選按鈕2,則僅第3部分必須隱藏。 如果選擇了第2部分的單選按鈕3,則也隱藏第4部分。

假設您有這樣的HTML

<div id='firstSection'>
    <input type='radio' name='sectionOne' value='Radio 1' /> 
    <input type='radio' name='sectionOne' value='Radio 1' />
    <input type='radio' name='sectionOne' value='Radio 1' />
</div>

<hr/>

<div id='secondSection'>
    <input type='radio' name='sectionOne' value='Radio A' /> 
    <input type='radio' name='sectionOne' value='Radio B' />
    <input type='radio' name='sectionOne' value='Radio C' />
</div>

然后,您需要在JavaScript中使用以下功能。

    function HideSection(){

    $('input:radio').change(function(e){
        // get the id of element to hide
        var selectedSectionId = $(this).parent().attr('id')
        var sectionToHide;
        if(selectedSectionId.indexOf('first') != -1)
         sectionToHide = selectedSectionId.replace('first','second');
        else
         sectionToHide = selectedSectionId.replace('second','first');
        // hide the element
        $('#' + sectionToHide).hide();
    });    
}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM