jQuery 如何在文档准备好时隐藏 div,然后从 Javascript 动态调用它?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/15382281/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to hide a div on document ready, and then call it dynamically from Javascript?
提问by blarg
I'm using this code to hide a div container where I'm placing text dynamically.
我正在使用此代码隐藏我动态放置文本的 div 容器。
$(document).ready(function(){
$(".slidingDiv").hide();
$(".show_hide").show();
$('.show_hide').click(function(){
$(".slidingDiv").slideToggle();
});
});
The problem I have is that I want to trigger the show div
from a javascript function instead of a predefined click event. I've found this example which mateches the function I want, but I'm not sure how to trigger it from javascript instead of a click function.
我的问题是我想div
从 javascript 函数而不是预定义的单击事件触发显示。我发现这个例子与我想要的功能相匹配,但我不确定如何从 javascript 而不是点击功能触发它。
回答by Dakait
just hide the div using css
只需使用 css 隐藏 div
display:none;
.slidingDiv{
display:none;
}
and show it when ever you want using
并在您想使用时显示它
.show()
$(".slidingDiv").show();
edit:
编辑:
after you question edit, you can always trigger the click event programatically like
在您提出问题编辑后,您可以随时以编程方式触发点击事件,例如
function yourFunction(){
$(".show_hide").click();
}
回答by SomeShinyObject
At any point in your script you can call the jQuery
object with your div
's id/class and run the show()
function. i.e.
在脚本中的任何一点,您都可以jQuery
使用您div
的 id/class调用对象并运行该show()
函数。IE
var javascript = "cool";
var foo = "I'm doing stuff";
var bar = "And some more stuff";
if (javascript === "cool")
jQuery(".slidingDiv").show();
else
$(".slidingDiv").show();
回答by Ayan Bhattacharjee
<script>
$(document).ready(function(){
$("input[type='file']").on("change", function () {
if(this.files[0].size > 1000000) //file size less than 1MB {
{
$("#fileAlert").show(); //calling a bootstrap 4 alert
}
$(this).val('');
}
});
});
</script>