jquery - 如何根据是否选中来设置复选框标签内的 DIV 样式？

Question

在我的 CSS 中，我将 .interest_selected_icon 设置为 display:none。如果复选框被选中，如何设置不同的 CSS 样式？

<input type="checkbox" id="people" name="chk_group[]" value="people">
<label class="interest_select" for="people">
    <div class="interest_wrapper">
        People
        <span class="interest_selected_icon">
            selected
        </span>
    </div>
</label>

Answer 1

不需要 jQuery，你完全可以在 CSS 中完成:

<style>
    .interest_selected_icon {
        display:none;
    }

    input[type=checkbox]:checked + .interest_select .interest_selected_icon {
        display:block;
    }
</style>