spanクラスのチェックでラジオボタンの色を変更させるには

Question

<label><span id="[0].sidLG" class="TEXT NOWRAP">
<input type="radio" name="_lg_str" value="0" checked="checked" onclick="setupEvent(event);if(!checkAndResetBlurCheckResult()){return false;}event_RowStatusUpdate('_lg_str');event_onChange('_lg_str')" onkeyup="setupEvent(event);cursor_onKeyUp('LG')" onkeydown="setupEvent(event);return event_onKeyDown4Item('LG', '')" onfocus="setupEvent(event);event_onFocus('_lg_str')" onblur="setupEvent(event);event_RowStatusUpdate('_lg_str');event_onBlur()"/> <span class="radio_label">起動</span>
</span>
</label>

<label><span id="[1].sidLG" class="TEXT NOWRAP">
<input type="radio" name="_lg_str" value="1" onclick="setupEvent(event);if(!checkAndResetBlurCheckResult()){return false;}event_RowStatusUpdate('_lg_str');event_onChange('_lg_str')" onkeyup="setupEvent(event);cursor_onKeyUp('LG')" onkeydown="setupEvent(event);return event_onKeyDown4Item('LG', '')" onfocus="setupEvent(event);event_onFocus('_lg_str')" onblur="setupEvent(event);event_RowStatusUpdate('_lg_str');event_onBlur()"/> <span class="radio_label">停止</span>
</span>
</label>

span[id^="[1].sidLG"]:checked{
  color: blue;
}

ラジオボタンがチェックされたら、「停止」の値を
青色にする場合、どのようにしたらいいのでしょうか？
実装したものだと、何も有効になりません。

ご教授宜しくお願いします。

Comments

[m.ts10806]

JavaScriptでの対応は検討されてませんか？

[kariya]

<span class="radio_label">停止</span>
ではなく
<label for="ラジオボタンのid">停止</label>
とするといかがでしょうか？

参考URL：http://proengineer.internous.co.jp/content/columnfeature/6492

[kumakumatan]

ご回答ありがとうございます。
JavaScriptでの対応とはどのような事が考えられますでしょうか？

宜しくお願いします。

[m.ts10806]

そういえばそもそもspanにcheckedはありませんね。html構造から変えないとJavaScriptでもあまり意味がなさそうです。
htmlは変に省略したりせずに他人が再現確認しやすいようになるべく全て提示してくださいね

[kei344]

HTMLが切れているので、省略せず提示してください。

[kumakumatan]

省略せずに記述したので宜しくお願いします。

Answer 1

こんな感じですが、idの付け方は考え直したほうがよいかと・・・

<style>
span[id^="[1].sidLG"] :checked+span{
  color: blue;
}
</style>
<span class="TEXT RAP" id="[1].sidLG">
<input type="radio" name="hoge"></input>
<span class="radio_label">停止</span>
<input type="radio" name="hoge"></input>
<span class="radio_label">その他</span>
</span>

Comments

[kumakumatan]

ありがとうございます。
解決できました。