文本框与复选框联动---星期选择

CSS:

 .subject
        {
            border: 1px solid #E7E4E4;
            background - color: White;
            margin - bottom: 5px;
            margin - top: 5px;
        }

JS:

Code
function chkCheck(chkID) {
            var text = document.getElementById("txtWeek");
            if (text.value != "") {
                if (chkID.checked) {
                    text.value += "," + chkID.value;
                }
                else {
                    var sp = text.value.split(',');
                    for (var i = 0; i < sp.length; i++) {

                        if (sp[i] == chkID.value) {
                            if (sp[i - 1]) {
                                text.value = text.value.replace("," + sp[i], "");
                            }
                            else if (sp[i + 1]) {
                                text.value = text.value.replace(sp[i] + ",", "");
                            }
                            else {
                                text.value = text.value.replace(sp[i], "");
                            }

                        }
                    }

                }
            }
            else {
                if (chkID.checked) {
                    text.value = chkID.value;
                }
            }
        }

HTML:

Code
    <div>
        <input name="txtWeek" type="text" maxlength="14" id="txtWeek" onfocus="this.blur()" style="cursor:pointer;" />
        <div id="week" class="subject" style="display:none;">
            <input type="checkbox" id="chkSunday" onclick="chkCheck(this)" value="0" title="Sunday" />Sunday
            <input type="checkbox" id="chkMonday" onclick="chkCheck(this)" value="1" title="Monday" />Monday
            <input type="checkbox" id="chkTuesday" onclick="chkCheck(this)" value="2" title="Tuesday" />Tuesday
            <input type="checkbox" id="chkWednesday" onclick="chkCheck(this)" value="3" title="Wednesday" />Wednesday
            <input type="checkbox" id="chkThursday" onclick="chkCheck(this)" value="4" title="Thursday" />Thursday
            <input type="checkbox" id="chkFriday" onclick="chkCheck(this)" value="5" title="Friday" />Friday
            <input type="checkbox" id="chkSaturday" onclick="chkCheck(this)" value="6" title="Saturday" />Saturday
        </div>
        <script type="text/javascript">
            $("#txtWeek").click(function() {
                var offset = $(this).offset();
                $("#week").css("left", offset.left).css("top", offset.top + 15).fadeIn("fast");
            });

            $("#week").hover(function() { }, function() {
                $(this).fadeOut("fast");
            });
        </script>
    </div>

没有什么技术性。。。纯粹记录。

转载于:https://www.cnblogs.com/pacer/archive/2009/09/24/1573139.html