摘要:在传课上看的视频教程,作业的代码写在这里,欢迎大家拍砖。
<!doctype html>
<html class="no-js">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<title>amazeUI测试用</title>
<link rel="stylesheet" href="../assets/css/amazeui.css">
</head>
<body>
<div class="am-container">
<br>
<button type="button" class="am-btn am-radius am-btn-default zt-btn-config" style="outline:none;">删除</button>
<br><br>
<button type="button" class="am-btn am-round am-btn-warning zt-btn-config" style="outline:none;">删除</button>
<br><br>
<button type="button" class="am-btn am-radius am-btn-default zt-btn-config" style="outline:none;">删除</button>
</div>
<script type="text/javascript" src="../assets/js/jquery.min.js"></script>
<script type="text/javascript" src="../assets/js/amazeui.js"></script>
<script>
$(".zt-btn-config").click(function(){
var btn = $(this);
if(btn.text() == '确认删除'){
alert("真的删除了");
btn.removeClass('am-btn-warning');
btn.addClass('am-btn-default');
btn.text('删除');
}else{
btn.removeClass('am-btn-default');
btn.addClass('am-btn-warning');
btn.text('确认删除');
window.setTimeout(function () {
btn.removeClass('am-btn-warning');
btn.addClass('am-btn-default');
btn.text('删除');
},3000);
}
});
</script>
</body>
</html>