如何通过设置时间隐藏或显示小部件
How to hide or show the widget by setting time
This 是我的博客,我已经实现了 2 个小部件,这些小部件已包含在下面的代码片段中。我的目标是实现如下图所示。我的意思是就像眨眼一样,但不完全是眨眼,而是 show/hide 特定的小部件,持续几天,比如 2 天或 1 周。我的意思是 2 个小部件应该由时间替换。
我的意思是,如果第一个小部件显示了一段时间,第二个小部件应该隐藏,如果第二个小部件显示,第一个小部件应该隐藏我的意思是有没有办法设置隐藏或显示小部件的时间。
<link rel="stylesheet" href="//cdn.rawgit.com/indrimuska/jquery-editable-select/master/dist/jquery-editable-select.min.css" />
<script src="//code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="//cdn.rawgit.com/indrimuska/jquery-editable-select/master/dist/jquery-editable-select.min.js"></script>
<div id="multi-search">
<select id="cmbColumn" name="cmbColumn">
<option value="" />Columns
<option value="apple+" />apple
<option value="grapes+" />grapes
</select>
<select id="cmbSidebar" name="cmbSidebar">
<option value="" />Sidebars
<option value="mango+" />mango
<option value="berry+" />berry
</select>
<script>
$('#cmbColumn').editableSelect();
$('#cmbSidebar').editableSelect();
</script>
<link rel="stylesheet" href="http://harvesthq.github.io/chosen/chosen.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
<script src="http://harvesthq.github.io/chosen/chosen.jquery.js" type="text/javascript"></script>
<div>
<em>Multiple Select with Groups</em><br>
<select data-placeholder="Your Favorite Football Team" style="width:350px;" class="chosen-select" multiple tabindex="6">
<option value=""></option>
<optgroup label="NFC EAST">
<option>Dallas Cowboys</option>
<option>New York Giants</option>
<option>Philadelphia Eagles</option>
<option>Washington Redskins</option>
</optgroup>
<script>
$(".chosen-select").chosen();
</script>
终于找到了这个问题的答案(连同"overflowstack9"):
使用 Date() 对象显示不同的控件以验证 show/hide 加载。
请确保这只是一个示例并阅读评论以确保您理解我们为什么不在此处使用事件或超时:
var control1VisibleCheck = function () {
var now = new Date();
//TODO: modify this logic to your needs: have a look on the Date() object's members and methods to implement what you need
if (now.getMinutes() % 2 == 0) //I'd like to show control1 on even minutes
return true;
return false;
}
if (control1VisibleCheck())
document.getElementById('multi-search-groups').style.display = 'none';
else
document.getElementById('multi-search').style.display = 'none';
fiddle: https://jsfiddle.net/uunzq61e/2/
This 是我的博客,我已经实现了 2 个小部件,这些小部件已包含在下面的代码片段中。我的目标是实现如下图所示。我的意思是就像眨眼一样,但不完全是眨眼,而是 show/hide 特定的小部件,持续几天,比如 2 天或 1 周。我的意思是 2 个小部件应该由时间替换。
我的意思是,如果第一个小部件显示了一段时间,第二个小部件应该隐藏,如果第二个小部件显示,第一个小部件应该隐藏我的意思是有没有办法设置隐藏或显示小部件的时间。
<link rel="stylesheet" href="//cdn.rawgit.com/indrimuska/jquery-editable-select/master/dist/jquery-editable-select.min.css" />
<script src="//code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="//cdn.rawgit.com/indrimuska/jquery-editable-select/master/dist/jquery-editable-select.min.js"></script>
<div id="multi-search">
<select id="cmbColumn" name="cmbColumn">
<option value="" />Columns
<option value="apple+" />apple
<option value="grapes+" />grapes
</select>
<select id="cmbSidebar" name="cmbSidebar">
<option value="" />Sidebars
<option value="mango+" />mango
<option value="berry+" />berry
</select>
<script>
$('#cmbColumn').editableSelect();
$('#cmbSidebar').editableSelect();
</script>
<link rel="stylesheet" href="http://harvesthq.github.io/chosen/chosen.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
<script src="http://harvesthq.github.io/chosen/chosen.jquery.js" type="text/javascript"></script>
<div>
<em>Multiple Select with Groups</em><br>
<select data-placeholder="Your Favorite Football Team" style="width:350px;" class="chosen-select" multiple tabindex="6">
<option value=""></option>
<optgroup label="NFC EAST">
<option>Dallas Cowboys</option>
<option>New York Giants</option>
<option>Philadelphia Eagles</option>
<option>Washington Redskins</option>
</optgroup>
<script>
$(".chosen-select").chosen();
</script>
终于找到了这个问题的答案(连同"overflowstack9"):
使用 Date() 对象显示不同的控件以验证 show/hide 加载。 请确保这只是一个示例并阅读评论以确保您理解我们为什么不在此处使用事件或超时:
var control1VisibleCheck = function () {
var now = new Date();
//TODO: modify this logic to your needs: have a look on the Date() object's members and methods to implement what you need
if (now.getMinutes() % 2 == 0) //I'd like to show control1 on even minutes
return true;
return false;
}
if (control1VisibleCheck())
document.getElementById('multi-search-groups').style.display = 'none';
else
document.getElementById('multi-search').style.display = 'none';
fiddle: https://jsfiddle.net/uunzq61e/2/