本篇内容主要讲解“vue项目input标签checkbox,change和click绑定事件的区别是什么”，感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷，实用性强。下面就让小编来带大家学习“vue项目input标签checkbox,change和click绑定事件的区别是什么”吧!我们经常在vue开发项目的过程中，遇到需要对input框使用v-modal的这种情况，在有的时候，不光需要双向数据绑定，还需要在改变数据之后绑定其它的操作，那么问题来了，你是使用@change绑定事件还是使用@click绑定事件建议不要通过click绑定事件，对待input标签，最好通过change来触发，本人血的教训。click执行的时间要早于change执行的时间，因为v-modal的时间是一个异步的。当点击之后，v-modal可能还没有来得及将绑定在data里面的数据改变，click绑定的事件就执行了，这会导致免费云主机域名click绑定事件里面拿到的data数据不是最新的。change绑定的事件是一定要等到input框的value值改变之后才会被触发。关于这一系列的顺序我是这样理解点击input框–> click事件生效 –> v-modal改变绑定的data数据 –> 渲染到页面上改变input的value值 –> change事件生效今天突然用到了input标签里的checkbox，发现还是有些概念不清不楚的，在这里总结一下。常用于input标签里type类型为checkbox和radio，是一个Boolean属性。规定在页面加载时预先被选定。可以通过js代码进行设置。以上的几种写法，都会得到相同的结果，就是标签被选中。这是因为在复选框里只要有checked属性，不管是够为其赋值，结果为空或true或false或任意值，均为选中状态。需要注意的是，在XHTML中禁止属性最小化，所以必须定义为可以利用JS或Jquery操作checked的值：在我使用的过程来看，强烈推荐使用.prop()方法进行设置或判断是否选中的操作。（当然这是jQuery里的方法）因为在我开始想到的是用attr()方法，然后踩坑里了…….用attr()设置复选框选中没有问题，问题出现在判断是否选中复选框。不管我选中还是没有选中，返回的都是“undefind”。之后还用prop()就美滋滋。后来自己又研究了一下，发现如果不需要实时的监听是否选中复选框的话，attr()和prop()都能得到结果，且attr返回:”checked”或”undefined”，prop返回true/false。因为在我所使用的项目中，需要用户点击复选框选中以后，标签栏就需要立刻做出反应，将对应的内容生成新标签回显给用户。这时候使用attr(‘checked’)在点击事件下获得checked属性，就会一直返回undefind。具体原因在后面会有解释，换成prop方法就不会出现这个问题。还有一种方式也可以，就是 .is(‘:checked’)// 返回true/false补充一下，关于prop和attr方法的区别：1.设置的属性值类型不同由于attr()函数操作的是文档节点的属性，因此设置的属性值只能是字符串类型，如果不是字符串类型，也会调用其toString()方法，将其转为字符串类型。prop()函数操作的是JS对象的属性，因此设置的属性值可以为包括数组和对象在内的任意类型。2.jQuery认为：attribute的checked、selected、disabled就是表示该属性初始状态的值，property的checked、selected、disabled才表示该属性实时状态的值(值为true或false)。即：attr()获取的是初始状态的值，即使取消了选中，也不会改变。prop()获取的值已经发生变化，是实时状态的值。（这就是我上面出问题的原因啦）1、设置第一个checkbox 为选中值2、设置最后一个checkbox为选中值3、根据索引值设置任意一个checkbox为选中值4、根据value值设置checkbox为选中值5、删除checkbox：①删除value=1的checkbox ②删除第几个checkbox6、选中所有奇数项或偶数项到此，相信大家对“vue项目input标签checkbox,change和click绑定事件的区别是什么”有了更深的了解，不妨来实际操作一番吧！这里是百云主机网站，更多相关内容可以进入相关频道进行查询，关注我们，继续学习！
本篇内容主要讲解“JavaScript DOM如何获取”，感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷，实用性强。下面就让小编来带大家学习“JavaScript DOM如何获取”吧!Document Object Model，缩写DOM，中文：文档对象模…
免责声明：本站发布的图片视频文字，以转载和分享为主，文章观点不代表本站立场，本站不承担相关法律责任；如果涉及侵权请联系邮箱：360163164@qq.com举报，并提供相关证据，经查实将立刻删除涉嫌侵权内容。
微信扫一扫 
