今天给大家讲一下简单的type切换(随便写了一下,效果比较low)
屏幕快照 2019-10-15 下午9.19.16.png
屏幕快照 2019-10-15 下午9.19.28.png
当我点击机票的时候会切换到1111,点击高铁票的时候会切换到3333,
那么该如何做呢;
话不多说,上代码
var leftul = document.querySelectorAll('.box .left-ul li');//获取左边ul下所有的li
var righttul = document.querySelectorAll('.box .right-ul li')//获取右边ul下所有的li
for (var i = 0; i < leftul.length; i++) {//循环ul
leftul[i].ind = i;//留下标记,保存下标
leftul[i].onclick = function () {//给leftul下的li绑定点击事件
for (var j = 0; j < righttul.length; j++) {//遍历所有li
leftul[j].className = "" ; //干掉所有li的类名active1,
righttul[j].className = "" ; // 干掉所有li的类名active2
}
leftul[this.ind].className="active1"//给当前li添加一个active1类名
righttul[this.ind].className="active2"
console.log(this.ind);
}
}
好啦,简单的type切换就完成了,如果有什么不对的地方,还请大家多多指出,谢谢大家!!!
网友评论