Jquery实现对a标签改变选中的背景色 支持多选 再次点击背景色消失

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <style type="text/css">
        .lanse
        {
            background-color: Blue;
        }
        .baise
        {
            background-color:White;
        }
    </style>
    <script src="../Js/jquery-last.js" type="text/javascript"></script>
    <script type="text/javascript">
        function dqxuanzhong(hh, id) {
            var a = $('#hid_msgdq').val();
            //            var newaa = a + id + ',';
            var newaa = a;
            var strs = new Array(); //定义一数组
            strs = newaa.split(","); //字符分割     
            var newa = "";
            var flag = true;
            if (strs.length > 0) {
                for (var i = 0; i < strs.length; i++) {
                    if (strs[i] != "") {
                        if (strs[i] == id) {
                            $('#' + hh).addClass("baise"); //点击后的颜色在这里改就好了
                            newa = newa + "";
                            flag = false;
                        }
                        else {
                            $('#dq_' + strs[i]).addClass("lanse");
                            newa = newa + strs[i] + ',';
                        }
                    }
                }
                if (flag) {
                    newa = newa + id + ',';
                    $('#dq_' + id).addClass("lanse");
                    $('#hid_msgdq').val(newa);
                } else {
                    $('#hid_msgdq').val(newa);
                }
            } else {
                $('#hid_msgdq').val(id + ',');
            }
            alert($('#hid_msgdq').val());
        }
        function msxuanzhong(o, id) {
            var a = $('#hid_msgms').val();
            //            var newaa = a + id + ',';
            var newaa = a;
            var strs = new Array(); //定义一数组
            strs = newaa.split(","); //字符分割     
            var newa = "";
            var flag = true;
            if (strs.length > 0) {
                for (var i = 0; i < strs.length; i++) {
                    if (strs[i] != "") {
                        if (strs[i] == id) {
                            $('#' + o).addClass("baise"); //点击后的颜色在这里改就好了
                            newa = newa + "";
                            flag = false;
                        }
                        else {
                            $('#ms_' + strs[i]).addClass("lanse");
                            newa = newa + strs[i] + ',';
                        }
                    }
                }
                if (flag) {
                    newa = newa + id + ',';
                    $('#ms_' + id).addClass("lanse");
                    $('#hid_msgms').val(newa);
                } else {
                    $('#hid_msgms').val(newa);
                }
            } else {
                $('#hid_msgms').val(id + ',');
            }
            alert($('#hid_msgms').val());
        }
    </script>
</head>
<body>
    <input type="hidden" id="hid_msgdq" value="" />
    <input type="hidden" id="hid_msgms" value="" />
    <div>
        <a id="dq_1" href="javascript:dqxuanzhong('dq_1',1)">北京</a> <a id="dq_2" href="javascript:dqxuanzhong('dq_2',2)">
            上海</a>
    </div>
    <div>
        <a id="ms_3" href="javascript:msxuanzhong('ms_3',3)">美食</a> <a id="ms_4" href="javascript:msxuanzhong('ms_4',4)">
            网购</a>
    </div>
</body>
</html>

原文地址:https://www.cnblogs.com/weiying/p/weiying_10_29.html