二、显示隐藏处理
含义:效果类似于jquery的toggle,如果它后面跟着的表达式为真值时则显示它所在的元素,为假值时则隐藏。
<head><meta charset="UTF-8"><meta name="Generator" content="EditPlus®"><meta name="Author" content=""><meta name="Keywords" content=""><meta name="Description" content=""><title>avalon-visible</title><style type="text/css">div div{width:260px;height:100px;}div.d1{background:red;}div.d2{background:green;}div.d3{background:blue;}</style><script type="text/javascript" src="../avalon.min.js"></script><script type="text/javascript">avalon.ready(function(){var vm = avalon.define({$id:'text',currentIndex:1,isShowBox:false,toggle:function(index){vm.currentIndex=index;}});setTimeout(function(){vm.isShowBox=true;},3000);avalon.scan();})</script></head><body ms-controller="text"><div ms-visible="isShowBox"><button ms-click="toggle(1)">色块[red]</button><button ms-click="toggle(2)">色块[green]</button><button ms-click="toggle(3)">色块[blue]</button><div class="d1" ms-visible="currentIndex===1"></div><div class="d2" ms-visible="currentIndex===2"></div><div class="d3" ms-visible="currentIndex===3"></div></div></body>