VUE复选框获取值

最新推荐文章于 2023-10-18 17:28:14 发布

他是信仰

最新推荐文章于 2023-10-18 17:28:14 发布

阅读量2.2k

点赞数 1

分类专栏：前端

本文链接：https://blog.youkuaiyun.com/weixin_42634971/article/details/89673908

版权

前端专栏收录该内容

4 篇文章

订阅专栏

VUE复选框获取值

<!DOCTYPE html>
<html lang="zh">
 <head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Vue 复选框</title>
  <link rel="stylesheet" href="index.css">
 </head>
 <body>
  <div id="app">
  <div>
  <input type="checkbox" v-model="result" id="html" value="html"/>
  <label for="html">Html</label>
  </div>
  <div>
  <input type="checkbox" v-model="result" id="css" value="css"/>
  <label for="css">css</label>
  </div>
  <div>
  <input type="checkbox" v-model="result"  id="java" value="java"/>
  <label for="java">java</label>
  </div>
  <p>当前选择{{result}}</p>
  </div>
  <script src="vue.js"></script>
  <script>
   var app=new Vue({
    el:"#app",
    data:{
     result:[
      "html","css","java"
     ]
    }
   })
  </script>
 </body>
</html>

关注博主即可阅读全文