<!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. Unity中销毁游戏对象的方式

    销毁方式 销毁物体的方式有两种:Destroy和DestroyImmediate两种,那两者有什么区别呢?细听分说. 两种方式都能达到销毁物体的目的,有以下区别: Destroy销毁场景中的物体但是内 ...

  2. verifier 调试内存泄露

    没啥技术含量,都是老段子了, 这次记下来,只是我想说,我也做过,留个念相. 前置条件,电脑里面必须得有Verifier,有了之后把自己的驱动加进去, WinDBG上双机,然后就可以跑了,跑一段时间就可 ...

  3. 继承内部类时使用外部类对象.super()调用内部类的构造方法

    问题简介   今天在看<Java编程思想>的时候,看到了一个很特殊的语法,懵逼了半天--一个派生类继承自一个内部类,想要创建这个派生类的对象,首先得创建其父类的对象,也就是这个内部类,而调 ...

  4. ctx.beginPath()开始新路径

    beginPath() 方法开始一条路径,或重置当前的路径. 提示:请使用这些方法来创建路径 moveTo().lineTo().quadricCurveTo().bezierCurveTo().ar ...

  5. vue项目 上传到git

    1. git add . 效果: 2. git commit -m '' 3. git push 效果: 4.在码云上就可以看到修改啦 2018-05-19  08:52:52

  6. SpringBoot生产/开发/测试多环境的选择

    多环境选择 一般一套程序会被运行在多部不同的环境中,比如开发.测试.生产环境,每个环境的数据库地址,服务器端口这些都不经相同,若因为环境的变动而去改变配置的的参数,明显是不合理且易造成错误的 对于不同 ...

  7. 重磅发布: 阿里云WAF日志实时分析上线 (含视频)

    摘要: 阿里云WAF与日志服务打通,对外开发Web访问与攻击日志.提供近实时的网站具体的日志自动采集存储.并提供基于日志服务的查询分析.报表报警.下游计算对接与投递的能力. 背景 Web攻击形势 互联 ...

  8. 14 win7 sp1下安装vs2015

    0 引言 在win7下安装vs2015的时候遇到了很多问题,看了很多帖子,尝试了很多次,终于成功了.网上也有大量关于win7 sp1下安装vs2015的帖子,我在安装的时候也参考了很多相关经验,这次写 ...

  9. LUOGU P1039 侦探推理 (字符串+模拟)

    传送门 解题思路 一道%你神题,\(string\)好强大啊..首先枚举一个周几,再枚举一个罪犯是谁,然后判断的时候就是枚举所有人说的话.定义\(fAKe[i]\)表示第\(i\)个人说的是真话还是假 ...

  10. python非对称加密模块rsa

    一.代码 # 导入rsa库 import rsa.common class RSA(object): def __init__(self): self.key= rsa.newkeys(256) se ...