vue中如何判断checkbox是否选中

本文转载自查看原文 2020-05-07 17:17 13943 Input表单相关/ Input提交相关

console.log(event.target.checked)

例：

实现：选中按钮激活，不选 input 加上disabled

方法一：@click方法：

<!DOCTYPE html>
<html lang="en">
<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>Document</title>
</head>
<body>
    <div id="app">
        <label for="ab1"><input type="checkbox" id="ab1"  @click = "checkbox()">我同意</label><br/>
        <button type ="button" :disabled = "!dis">注册</button>

    </div>
</body>
<script src="js/vue2.js"></script>
<script type="text/javascript">
var vm = new Vue({
    el:'#app',
    data:{
        dis:false
    },
    methods:{
        // 选中为true,未选中为false
        checkbox(){
            this.dis = event.target.checked
            console.log(event.target.checked)
        }
    }
})
</script>

</html>

方法二： v-model ,v-model =“dis”的值就是checked 是否选中的值等同于 event.target.checked

<div id="app">
        <label for="ab2"><input type="checkbox" id="ab2" v-model="dis">我同意 {{dis}}</label><br/>
        <button type ="button" :disabled = "!dis">注册</button>
</div>


var vm = new Vue({
    el:'#app',
    data:{
        dis:false
    },
    methods:{
       
    }
})

免责声明！

本站转载的文章为个人学习借鉴使用，本站对版权不负任何法律责任。如果侵犯了您的隐私权益，请联系本站邮箱yoyou2525@163.com删除。

猜您在找 vue中如何判断checkbox是否选中 vue中如何判断checkbox是否选中 checkbox如何判断是否选中判断checkbox是否选中判断HTML中的checkbox是否被选中 jq、js中判断checkbox是否选中 js中对radio和checkbox是否选中的判断 JQuery判断CheckBox是否选中如何判断Input的checkbox是否选中 js判断checkbox是否选中