I have a button on my page which when pressed displays a hidden div. Is there a way for me to use jquery .show so that this div (containing text) is shown, appears for a few seconds, say 3 seconds, and then is hidden again without a user havind to re-click the button. (ie. use the .hide jquery function). Below i will attach the appropriate code:
我的页面上有一个按钮,按下时会显示一个隐藏的div。有没有办法让我使用jquery .show这样显示这个div(包含文本),显示几秒钟,比如说3秒,然后再次隐藏,没有用户havind重新点击按钮。 (即使用.hide jquery函数)。下面我将附上相应的代码:
<body>
<button class="info" id="one"> ? </button>
<div class="pop" id="1" style="display: none">
A Careless criminal has dropped a weapon!
</div>
<script>
$("button#one").click(function () {
$("div#1").show("slow");
});
</script>
</body>
2 个解决方案
#1
4
Description
You should use jQuery's .show()
, .delay()
and .hide()
method for that.
你应该使用jQuery的.show(),. delay()和.hide()方法。
Note: jQuery .show()
and .hide()
uses .animate()
internally.
注意:jQuery .show()和.hide()在内部使用.animate()。
Check out the sample the this jSFiddle Demonstration.
查看此jSFiddle演示的示例。
Sample
$("button#one").click(function () {
$("div#1").show("slow").delay(3000).hide("slow");
});
More Information
#2
2
Yes, easily, using delay
and hide
:
是的,很容易,使用延迟和隐藏:
$('div#1').show('slow').delay(3000).hide('slow');
Note that this works because hide
is an animation function. If you didn't have an animation function and wanted to do something else (e.g. removing with remove
) you'd have to use a different method, using callbacks and setTimeout
.
请注意,这是有效的,因为hide是一个动画功能。如果您没有动画功能并且想要执行其他操作(例如,使用remove删除),则必须使用不同的方法,使用回调和setTimeout。
#1
4
Description
You should use jQuery's .show()
, .delay()
and .hide()
method for that.
你应该使用jQuery的.show(),. delay()和.hide()方法。
Note: jQuery .show()
and .hide()
uses .animate()
internally.
注意:jQuery .show()和.hide()在内部使用.animate()。
Check out the sample the this jSFiddle Demonstration.
查看此jSFiddle演示的示例。
Sample
$("button#one").click(function () {
$("div#1").show("slow").delay(3000).hide("slow");
});
More Information
#2
2
Yes, easily, using delay
and hide
:
是的,很容易,使用延迟和隐藏:
$('div#1').show('slow').delay(3000).hide('slow');
Note that this works because hide
is an animation function. If you didn't have an animation function and wanted to do something else (e.g. removing with remove
) you'd have to use a different method, using callbacks and setTimeout
.
请注意,这是有效的,因为hide是一个动画功能。如果您没有动画功能并且想要执行其他操作(例如,使用remove删除),则必须使用不同的方法,使用回调和setTimeout。