如何创建一个简单的Mootools弹出窗口

Question

我想创建一个简单的Mootools弹出窗口，如下所示。

<?php for($i=1;$i<10;$i++) : ?> 

<a id="link_<?php echo $i;?>" onclick="viewContent(<?php echo $i;?>)">Click <?php echo $i;?></a> 
<br/> 
    <div class="modalDialog" id="content_<?php echo $i;?>" style="position:absolute;z-index: 100000; display: none; width: 300px; height: 150px; left: 430px; top: 143px;"> 
     <h1>Message<?php echo $i;?></h1> 
    </div> 

<?php endfor; ?> 

<script language="javascript"> 
function viewContent(id) 
{ 
    $('content_'+id).style.display = ''; 
} 
</script> 

虽然点击一个链接，它会隐藏除此之外的所有其他内容区域，同时可见内容应该显示为一个弹出窗口。在上面的脚本中我们需要什么改变。

Answer 1

所以你想要隐藏除点击之外的所有东西？使用$$选择器：

function viewContent(id) { 
    $$('.modalDialog').each(function(el){ 
     el.setStyle('display', 'none'); 
    }); 
    $('content_'+id).setStyle('display', 'block'); 
}