更改收音機爲真時的行爲（無需更改HTML結構）

當收音機爲真時，我需要在（span class =「ui-radiobutton-icon」）中應用樣式的朋友可以幫助我。感謝。更改收音機爲真時的行爲（無需更改HTML結構）

限制：HTML結構

<div class="ui-radiobutton ui-widget"> 
    <div class="ui-helper-hidden-accessible"> 
     <input type="radio" name="groupname" value="Masculino" ng-reflect-checked="true"> 
    </div> 
    <div ng-reflect-ng-class="[object Object]" class="ui-radiobutton-box ui-widget ui-state-default ui-state-active"> 
     <span class="ui-radiobutton-icon fa fa-fw fa-circle" ng-reflect-klass="ui-radiobutton-icon" ng-reflect-ng-class="[object Object]"></span> 
    </div> 
</div>

來源

2016-09-26 Fellipe J. de Sousa

你需要家長選擇要做到這一點，當他們不存在（和你不能改變的標記），將需要的腳本。爲什麼你不能改變標記？ ...您可以移動實際輸入並在其位置使用標籤，並且可以在不使用腳本的情況下完成 – LGSon

「ui-radio button」類可以是根...它是第三家公司的組件我正在自定義接口 –

下面是使用你的結構樣品，不過與無線移動至ui-radiobutton。

這個工作適合你嗎？

input { 
 
    display: none; 
 
} 
 
label { 
 
    display: inline-block; 
 
    width: 16px; 
 
    height: 16px; 
 
    border-radius: 50%; 
 
    border: 3px solid black; 
 
} 
 
input:checked ~ .ui-helper-hidden-accessible label { 
 
    background: gray; 
 
} 
 
input:checked ~ .ui-radiobutton-box .ui-radiobutton-icon { 
 
    color: red; 
 
}

<div class="ui-radiobutton"> 
 
    <input id="ui-radio-hidden" type="radio" name="uir"> 
 
    <div class="ui-helper-hidden-accessible"> 
 
    <label for="ui-radio-hidden"></label> 
 
    </div> 
 
    <div class="ui-radiobutton-box"> 
 
    <span class="ui-radiobutton-icon fa fa-fw fa-circle">Red when checked</span> 
 
    </div> 
 
</div>

來源

2016-09-26 20:11:27 LGSon

不幸的是，我無法更改結構，請參閱我自定義的組件： [www.primefaces.org]（http://www.primefaces.org/primeng/#/radiobutton） –

@FellipeJ。 deSousa然後腳本是你唯一的選擇（截至今天至少） – LGSon

更改收音機爲真時的行爲（無需更改HTML結構）

回答

相關問題