元素的隐藏和显示（v-show指令)

除了click单击事件，还有mouseover，mouseover等鼠标事件。
dbclick双击事件。

v-on:click/mouseover/mouseover/mousedown/dbclick

v-show指令

v-show="true/false" 控制元素显示/隐藏示例代码：

<!DOCTYPE html>
<html>
<head><title></title><meta charset="utf-8"><script src="http://unpkg.com/vue/dist/vue.js"></script><script type="text/javascript">window.onload = function(){var vm = new Vue({el:'#box',data:{isShow:false,},methods:{toggle:function(){this.isShow = !this.isShow;}}});}</script>
</head>
<body><div id="box"><input type="button" value="toggle" v-on:click="toggle()"> <br /><div v-show="isShow" style="width: 100px;height: 100px;background: red"></div></div>
</body>
</html>

元素的隐藏和显示（v-show指令)相关推荐

前端笔记（9）元素的隐藏与显示，css用户界面样式，vertical-align垂直对齐，溢出文字省略号显示，css精灵技术，过渡，焦点，滑动门，margin负值
css样式表/层叠样式表(7) 元素的隐藏与显示 (1)dispaly显示 (2)visibility可见性 (3)overflow溢出 css用户界面样式鼠标样式cursor 轮廓线outline ...
CSS基础(part15)--元素的隐藏与显示
学习笔记,仅供参考,有错必纠参考自:pink老师学习笔记文章目录元素的隐藏与显示 display显示 visibility可见性 overflow溢出显示与隐藏总结元素的隐藏与显示 disp ...
vue控制元素的隐藏和显示
vue动态控制元素的隐藏和显示 <template><div @click="clickbj(i)"> //i 为父元素 for 循环的 index点击&l ...
jquery控制元素的隐藏和显示的几种方法。
使用jquery控制div的显示与隐藏,一句话就能搞定,例如: 1.$("#id").show()表示为display:block, $("#id").hide ...
jQuery前端开发学习指南(18)——利用jQuery实现元素的隐藏、显示和切换及其动画效果
版权声明本文原创作者:谷哥的小弟作者博客地址:http://blog.csdn.net/lfdfhl 概述在jQuery框架中可便捷地以动画形式隐藏和显示以及切换元素,常用方式有如下三种:默认方 ...
js控制页面元素的隐藏与显示
2019独角兽企业重金招聘Python工程师标准>>> <body> <div> <button οnclick='javascript:Layer ...
原生js设置div隐藏或者显示_JavaScript动画方式控制div元素的隐藏和显示
jQuery实现此功能相对比较简单,具体参阅点击按钮动画方式隐藏和显示div一章节. 结合CSS3实现此功能也非常便利和适合,具体参阅JavaScript与CSS3动画方式改变元素尺寸一章节. 原生J ...
jquery控制元素的隐藏和显示
很简单,做个笔记,方便查阅 $("#id").show()表示为display:block, $("#id").hide()表示为display:none; $ ...
CSS的元素的隐藏与显示
显示与隐藏 1.介绍: display:使段落生出行内框 visibility :属性规定元素是否可见. 2.display属性值描述 none 此元素不会被显示. block 此元素将显 ...

元素的隐藏和显示（v-show指令)

元素的隐藏和显示（v-show指令)相关推荐

最新文章

热门文章