У меня есть клиент, который запрашивает переключатели с выбором зеленого, желтого, красного и синего (N / A). У меня jQueryUI работает нормально, но, очевидно, он показывает только базовый цвет и другой цвет при нажатии.
Я хочу, чтобы каждая радио-кнопка по умолчанию загружалась серым цветом, затем менялась на зеленую, если вы выбрали первую радио-кнопку, желтую, если вы выбрали вторую, и т. Д.
Чтобы еще больше усложнить это, я применяю его к радиобуттон-листу .NET.
Вот сгенерированный код:
<div id="radio" class="ui-buttonset">
<table border="0" id="ctl00_ContentPlaceHolder1_rdoGreet1">
<tbody>
<tr>
<td><input type="radio" value="2" name="ctl00$ContentPlaceHolder1$rdoGreet1" id="ctl00_ContentPlaceHolder1_rdoGreet1_0" class="ui-helper-hidden-accessible"><label for="ctl00_ContentPlaceHolder1_rdoGreet1_0" aria-pressed="false" class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-left" role="button" aria-disabled="false"><span class="ui-button-text">GREEN</span></label></td>
<td><input type="radio" value="1" name="ctl00$ContentPlaceHolder1$rdoGreet1" id="ctl00_ContentPlaceHolder1_rdoGreet1_1" class="ui-helper-hidden-accessible"><label for="ctl00_ContentPlaceHolder1_rdoGreet1_1" aria-pressed="false" class="ui-button ui-widget ui-state-default ui-button-text-only" role="button" aria-disabled="false"><span class="ui-button-text">YELLOW</span></label></td>
<td><input type="radio" value="0" name="ctl00$ContentPlaceHolder1$rdoGreet1" id="ctl00_ContentPlaceHolder1_rdoGreet1_2" class="ui-helper-hidden-accessible"><label for="ctl00_ContentPlaceHolder1_rdoGreet1_2" aria-pressed="true" class="ui-button ui-widget ui-state-default ui-button-text-only ui-state-active" role="button" aria-disabled="false"><span class="ui-button-text">RED</span></label></td><td><input type="radio" value="-1" name="ctl00$ContentPlaceHolder1$rdoGreet1" id="ctl00_ContentPlaceHolder1_rdoGreet1_3" class="ui-helper-hidden-accessible"><label for="ctl00_ContentPlaceHolder1_rdoGreet1_3" class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-right" aria-pressed="false" role="button" aria-disabled="false"><span class="ui-button-text">N/A</span></label></td>
</tr>
</tbody></table>
</div>