请大家帮忙一下，如何实现这种效果？

请大家帮忙一下，怎么实现这种效果？？
S和M是点击后的效果,L和XL是点击前的效果，我想要当我点击S后再点击M，这时S按钮能恢复原状。想用前台代码实现。javascript

请问大家该怎么实现呢？

------解决方案--------------------
4个的样式先设置为一样的。然后点击的时候先遍历一下。或者全部设置为一样的然后把点击的按钮样式进行修改。
------解决方案--------------------

HTML code

    <div id="divContainer">
        <input type="button" value="A" onclick="setBackground(this)" />
        <input type="button" value="B" onclick="setBackground(this)" />
        <input type="button" value="C" onclick="setBackground(this)" />
        <input type="button" value="D" onclick="setBackground(this)" />
    </div>

    <script type="text/javascript">
        function setBackground(o) {
            var btnArr = document.getElementById('divContainer').getElementsByTagName('input');
            for (var i = 0; i < btnArr.length; i++) {
                btnArr[i].style.backgroundColor = '';
            }

            o.style.backgroundColor = 'red';
        }
    </script>

------解决方案--------------------

探讨

引用:

选中和不选中则为你说要的2种状态的样式.

对，问题就是判断是选中了还是没有

------解决方案--------------------
- - 。。。
你就这样进行操作咯。。

点击的时候记下是那个被点击了。然后吧4个样式全部统一然后把点击的样式进行改变就好了。

请大家帮忙一下，如何实现这种效果？

相关推荐