Question

我在视图中有两个小部件，其中一个是yii CGridView小部件，另一个是日历小部件

基本上，日历和网格都会以不同的风格显示事件。

我需要的是我在顶部放置一个按钮，然后点击我的小工具将切换

假设当我点击按钮时显示当前的gridview，那么将显示日历视图，反之亦然

请帮助我如何在不使用jquery的情况下完成此任务。

Answer 1

以下是您可以做的事情：

<span id="grid">Grid</span><span id="calendar" style="display:none;">Calendar</span>

<button id="tglBtn">Toggle</button>

<script type="text/javascript">
var btn = document.getElementById('tglBtn');
var grid = document.getElementById('grid');
var calendar = document.getElementById('calendar');

btn.addEventListener('click', toggle);
function toggle() {
    grid.style.display = (grid.style.display == 'none') ? 'block' : 'none';
    calendar.style.display = (calendar.style.display == 'none') ? 'block' : 'none';
}</script>

你基本上做的是，使用css隐藏其中一个小部件，然后将click事件监听器附加到处理切换的切换按钮。

希望有所帮助：D

如何在yii中的两个小部件之间切换

1 个答案: