【JS】Tab面板

微信订阅号：Rabbit_svip

微信订阅号：Rabbit_svip

HTML代码

d1
d2
d3

JS代码

var aInput = document.getElementsByTagName('input');
var div = document.getElementsByTagName('div');

function show(a) {
    return function() {
        for(var j = 0; j

---

CSS自己调。

这个简单的Tab面板切换，需要注意的地方是用了2个for循环。

for(var i = 0; i

这个循环的作用是为每个input标签绑定一个点击事件。之所以要在点击之后还要调用另一个函数，是因为for循环的执行速度太快了，在点击button之后的瞬间，i就变成了3。如果不调用另一个函数，而是在onclick之后就等于一个function，出现的情况是不管点哪个button，最后显示的都会是最后一个面板。

for(var i = 0; i

如果代码是这样，可以看到最后输出的都是 3 。

微信订阅号：Rabbit_svip

所以正确方法是在绑定onclick之后，通过传参，把点击那刻 i 的值传给show()函数。然后再通过 show() 函数去设置该显示哪个div。