js实现ATM机存取款功能
130 浏览量
2020-10-17
11:09:47
上传
评论
收藏 50KB PDF 举报
js实现实现ATM机存取款功能机存取款功能
主要为大家详细介绍了js实现ATM机存取款功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
js是一个功能十分强大的脚本语言，通过js能实现很多有意思的demo！而要实现那些功能炫酷、特效美观的东西DOM操作是
必不可少且尤为重要的！这个ATM机存取款的案例，就用到js中一些简单的DOM操作来实现其功能。
ATM机案例功能需求：
1.用户最多只能有三次输入卡号和密码的机会，如果超过三次，则提示卡号已被锁定
2.用户取款的金额不能大于卡上的账户余额
3.存取功能完成后，要更新相应的余额信息
登录界面代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ATM</title>
<script src="ATM.js"></script>
<style>
div{
width: 300px;
height: 200px;
margin: 0 auto;
border:1px solid black;
border-radius: 5px;
text-align: center;
}
p {
font-size: 20px;
}
button {
border: 0px;
padding: 5px;
background-color: green;
color: white;
}
</style>
</head>
<body>
<div>
<p>ATM机</p>
<p><label>卡号：</label><input type="text" id="account"></p>
<p><label>密码：</label><input type="password" id="password"></p>
<p><button onclick="login()">登录</button></p>
</div>
</body>
</html>
主页界面代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ATM</title>
<script src="ATM.js"></script>
<style>
div{
width: 300px;
height: 200px;
margin: 0 auto;
border:1px solid black;
border-radius: 5px;
text-align: center;
}
p {
font-size: 20px;
}
button {
border: 0px;
padding: 5px;
background-color: green;
color: white;
}
</style>
资源评论
weixin_38677505
- 粉丝: 4
- 资源: 971
最新资源
- 通道处理过程的模拟通常涉及对通道处理机制的理解与实现.txt
- Flume进阶-自定义拦截器jar包
- Dubins曲线算法讲解和在运动规划中的使用.pdf
- 上市公司-股票性质数据-工具变量（民企、国企、央企）2003-2022年.dta
- 上市公司-股票性质数据-工具变量（民企、国企、央企）2003-2022年.xlsx
- Reeds+Shepp曲线算法讲解和实现.pdf
- 毕业设计基于SpringBoot+MyBatisPlus+MySQL+Vue的外卖配送信息系统源代码+数据库
- 词向量（Word Embeddings）是自然语言处理（NLP）领域的一种重要技术.txt
- Surfer，线性函数
- MyBatis 的动态 SQL 是其核心特性之一.txt
资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！
点击此处反馈
