<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css" media="screen">
.twenty {
width: 29%;
height: 35px;
border: 1px solid #c3c3c3;
color: #8b8b8b;
margin-top: 19px;
margin-left: 10px;
float: left;
border-radius: 8px;
text-align: center;
line-height: 35px;
font-size: 13px;
}
.elect {
border: 1px solid #db3752;
color: #db3752;
}
</style>
</head>
<body>
<div class="twenty elect">20元</div>
<div class="twenty">50元</div>
<div class="twenty right">100元</div>
<div class="twenty">200元</div>
<div class="twenty">500元</div>
<div class="twenty right">其他金额</div>
<script type="text/javascript">
// 选择充值金额
var payMoney = document.getElementsByClassName('twenty');
for (var i = 0; i < payMoney.length; i++) {
payMoney[i].onclick = function() {
delClass()
var classVal = this.getAttribute('class');
classVal = classVal.concat(" elect");
this.setAttribute("class", classVal);
}
}
// 删除所有elect类
function delClass() {
var payMoney = document.getElementsByClassName('twenty');
for (var i = 0; i < payMoney.length; i++) {
var allClass = payMoney[i].getAttribute('class');
allClass = allClass.replace('elect', '');
payMoney[i].setAttribute('class', allClass)
}
}
</script>
</body>
</html>
点击切换按钮 源生js实现
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
- 文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
推荐阅读更多精彩内容
- 本文主要针对APP国际化进行操作，使APP内部控件显示语言可以不随系统语言做改变，自由切换. 效果如下： 核心方法...
- Git: https://github.com/DrunkenMouse/clickCutViewAndConta...
- 在cell类的.h中添加 在cell类的.m中Button的点击方法中添加 然后在控制器的UITableViewD...
- self.tempBtn.selected = NO;buybtn.selected=YES; self.temp...
