1 Star 0 Fork 0

zhangjiamei/zhangjiamei_24

加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
文件
该仓库未声明开源许可证文件(LICENSE),使用请关注具体项目描述及其代码上游依赖。
克隆/下载
07-事件绑定.html 1.38 KB
一键复制 编辑 原始数据 按行查看 历史
zhamgjiamei 提交于 2020-06-16 23:27 . 6月16日作业
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="app">
<div>
用户名:
<input v-model='a' type="text" id="username">
<br> 密码:
<input v-model='b' type="password" id="password">
<br>
<span style="color: red">{{result}}</span>
<button @click='handle'>登录</button>
</div>
</div>
<script src="./js/vue.js"></script>
<script>
// 需求: 点击按钮, 要得到用户在输入框输入的用户名和密码,如果用户名和密码是zhangsan和123456, 则在span标签内部显示: 登录成功, 否则显示用户名或者密码错误
// 使用v-on的方式对button进行点击事件的监听
const vm = new Vue({
el: '#app',
data: {
a: '',
b: '',
result: ''
},
methods: {
handle: function () {
if (this.a == 'zhangsan' && this.b == '123456') {
this.result = '登录成功'
} else {
this.result = '用户名或密码错误'
}
}
}
})
</script>
</body>
</html>
Loading...
马建仓 AI 助手
尝试更多
代码解读
代码找茬
代码优化
1
https://gitee.com/zhangjiamei/zhangjiamei_24.git
[email protected]:zhangjiamei/zhangjiamei_24.git
zhangjiamei
zhangjiamei_24
zhangjiamei_24
master

搜索帮助