<!DOCTYPE html>

<html lang="zh">

<head>

    <title></title>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <script src="https://unpkg.com/vue/dist/vue.js"></script>

    <link href="../css/style.css" rel="stylesheet"> </head>

<body>

<div id="myApp">

    <h1>表单复选框</h1>

    <input type="checkbox" id="生化危机7" value="生化危机7" v-model="checkedGames">

    <label for="生化危机7">生化危机7</label>

    <input type="checkbox" id="模拟飞行" value="模拟飞行" v-model="checkedGames">

    <label for="模拟飞行">模拟飞行</label>

    <input type="checkbox" id="塞尔达传说" value="塞尔达传说" v-model="checkedGames">

    <label for="塞尔达传说">塞尔达传说</label>

    <br>

    <p>您选择的游戏是: {{ checkedGames }}</p>

</div>

<script>

    var myApp = new Vue({

        el: '#myApp',

        data: {

            checkedGames: []

        },

        methods: {

        },

    });

</script>

</body>

</html>

表单复选框input[type="checkbox"]的更多相关文章

  1. 关于复选框input[type=checkbox]

    关于复选框input[type=checkbox],其实在前面的文章中说过一次,当时主要关注点在设置复选框的状态,利用prop实现,今天继续关注一下复选框. 自己在项目中,遇到一个全选/全不选的需求, ...

  2. AngularJS（六）：表单-复选框

    本文也同步发表在我的公众号“我的天空” 复选框 复选框只有两个值:true或者false,因此在AngularJS中,一般都是将复选框的ng-model绑定为一个布尔值属性,通过这两个布尔值来决定其勾 ...

  3. SpringMVC 表单复选框处理

    <form action="" method="post"> <c:forEach items="${dblist}" v ...

  4. python selenium单/复选框操作

    一.单选:radio 1.首先是定位选择框的位置 2.定位id,点击图标就可以了,代码如下(获取url地址方法:把上面源码粘贴到文本保存为.html后缀后用浏览器打开,在浏览器url地址栏复制出地址就 ...

  5. 复选框input:checkbox

      复选框 CreateTime--2017年6月5日14:04:55Author:Marydon 五.复选框 (一)语法 <input type="checkbox" /& ...

  6. js做全选，用一个checkbox复选框做多个checkbox复选框的全选按钮，有一个复选框未被选择时，全选按钮的checked就为false

    用一个checkbox复选框做多个checkbox复选框的全选按钮,有一个复选框未被选择时,全选按钮的checked就为false,当所有checkbox都被选中时,全选按钮也被选中. 详解: 有两种 ...

  7. javascript入门 之 ztree (九 单/复选框问题)

    <!DOCTYPE html> <HTML> <HEAD> <meta http-equiv="content-type" content ...

  8. 原创：纯CSS美化单复选框（checkbox、radio）

    最重要的一点,隐藏选择框本身.不多说了,上代码: <!doctype html> <html> <head> <meta charset="utf- ...

  9. 工作需求----表单多选框checkbox交互

    关于多选框,反选及选取几个: 1.html内容 <!--begin checkbox--> <div class="c_n_manage_tablexx"> ...

随机推荐

  1. Southern African 2001 Stockbroker Grapevine /// Floyd oj1345

    题目大意: 输入n 接下来n行 每行输入m 接下来m对a,b 若干个人之间会传播谣言,但每个人传播给其他人的速度都不一样, 问最快的传播路线(即耗时最短的)中最耗时的一个传播环节. 如果其中有人不在这 ...

  2. mac NTFS 关于错误-36，rm Input/output error

    当传输文件时出现Mac错误代码36 当我向一个U盘或存储卡里传输文件时,出现了Mac Error Code36,我该如何解决? Mac,传输文件,错误代码36,U盘,卡片 Mac OS X Snow ...

  3. JS对象 indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。

    返回指定的字符串首次出现的位置 indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置. 语法 stringObject.indexOf(substring, startpos) 参 ...

  4. javascript小技巧-js小技巧收集(转)

    本文转载自:http://blog.csdn.net/ocean20/article/details/2498699 每一项都是js中的小技巧,但十分的实用! 1.document.write(&qu ...

  5. Android 开发 框架系列 OkHttp文件下载功能实现（含断点续传）

    前言 此篇博客只是下载功能的记录demo,如果你还不太了解okhttp可以参考我的另一篇博客https://www.cnblogs.com/guanxinjing/p/9708575.html 代码部 ...

  6. css---8 过渡属性刨析

    1.       transition-property 默认值为 all,表示所有可被动画的属性都表现出过渡动 可以指定多个 property 属性值: none 没有过渡动画. all 所有可被动 ...

  7. python3文件方法

    Python3 File(文件) 方法 需要注意:打开文件的 mode 参数注意区别文件指针位置 rw/rw+ 文件指针是在文件的开头,w任何模式都是会删除之前原有的内容的, a是追加且,打开文件指针 ...

  8. 启动web项目，监听器、过滤器、拦截器启动顺序

    启动顺序:监听器 > 过滤器 > 拦截器 记忆技巧:接到命令,监听电报,过滤敌情,拦截行动.

  9. csps模拟92数列，数对，最小距离题解

    题面:https://www.cnblogs.com/Juve/articles/11767225.html 数列: 简化题意:已知a,b,c,求满足$a*x+b*y=c$的$x+y$最小值 然后ex ...

  10. 「STL」bitset正传

    前言 之前一些需要转二进制来解决的题目我看到很多大佬用了bitset. 然而我并不会这东西.看上去很高级的样子…… 改题改累了来学习一下233. 正文 一.bitset的构造 bitset有三种构造方 ...