jquery复选框里面的内容选定后 , 根据后台状态换掉相应选项的图片

  1. 选中时触发 , 根据后台数据状态更换相应图片
  2. 取消选中时 , 回到原始图片
<body>
        <div class="AllLine">全线车站PA监控</div>x`
        <!--区域选择-->
        <div class="region">
            <p class="case_text">区域选择</p>
            <div class="box">
                <ul class="box-list clearfix">
                    <li>
                        <div class="index">01</div>
                        <div class="img"><img src="../static/imagess/pademo_grey.png" th:src="@{/imagess/pademo_grey.png}"></div>
                        <label><input type="checkbox" name="station_name" id="01" value="七莘路站" />七莘路站</label>
                    </li>
                    <li>
                        <div class="index">02</div>
                        <div class="img"><img src="../static/imagess/pademo_grey.png" th:src="@{/imagess/pademo_grey.png}"></div>
                        <label><input type="checkbox" name="station_name" id="02" value="虹莘路站" />虹莘路站</label>
                    </li>
                    <li>
                        <div class="index">03</div>
                        <div class="img"><img id="03" src="../static/imagess/pademo_grey.png" th:src="@{/imagess/pademo_grey.png}"></div>
                        <label><input type="checkbox"  name="station_name" id="03" value="03" />顾戴路站</label>
                    </li>

这个是部分html代码

$('input[name="station_name"]').click(function() {
    if (this.checked) {
         $(this).siblings('.box').find('img').attr('src', '../static/imagess/pademo_blue.png');

    } else {
        alert("hello");

    }
});

这个是我的jquery 代码 , 改了很多次总是不对 , 请大神帮忙看一下 , 万谢

$('input[name="station_name"]').click(function() {
var url=$(this).parents('li').find('img').attr('src');
if (this.checked) {
$(this).parents('li').find('img').attr('src', '../static/imagess/pademo_blue.png');
} else {
$(this).parents('li').find('img').attr('src',url);
alert("hello");

}

});