Template
<div @click="hideDiv">
<el-button ref="btn" @click.stop="showDiv = !showDiv">显示隐藏div</el-button>
<div v-if="showDiv" ref="div">我是div</div>
</div>
Script
data () {
return {
showDiv: false
}
},
methods: {
hideDiv () {
const div = this.$refs.div // 得到btn
if (div) {
this.showDiv = true
if (!(div.contains(event.target))) { // 点击div以外区域，隐藏div
this.showDiv = false
}
}
}
}
Template Script
情形：左右两个div，有一个小按钮，点击时候，可以控制左边的div显示或隐藏，右边的div随着左边的div隐藏显示...
js调起打印（某个div里的内容） vue + elementUI vue js css（打印时的样式，隐藏掉打印按钮）
动画 1、基本效果（显示和隐藏） $(“div”).show; //让div显示$(“div”).hide(...
点击按钮显示/隐藏Div（弹出菜单）特效实现过程和原理分析if的基本形式 扩展为a链接添加JS ClassNam...
《HTML控制DIV的显示与隐藏》 通过JS控制DIV的显示和隐藏。具体代码如下：
开发过程中经常会遇到上图中的需求。点击div显示删除按钮，当点击其他地方时删除按钮隐藏。基本上都能想到利用focu...
用mobx改变组件状态有三个按钮和一个DIV，点击按钮后在DIV中显示对应的文字。点击“悟空”按钮后
js控制div的显示与隐藏
本文标题：在Vue里，点按钮显示/隐藏div，点按钮以外区域隐藏div
本文链接：https://www.haomeiwen.com/subject/jxcdgrtx.html
网友评论