使用javascript隐藏div

我正在使用Javascript来隐藏搜索框，直到点击一个框。这工作正常。使用javascript隐藏div

但是，当第一次加载页面时，您可以在那里看到搜索框，然后在页面完全加载后它会消失。

我怎样才能使它隐藏，而不是显示在所有我的按钮被点击，直到..

这是JavaScript：

<script type="text/javascript"> 
$(function(){ 
$(".search").hide(); 
$(".clicktosearch").on("click", function(){ 
    $(".search").slideToggle("600");

.search是实际的搜索框 .clicktosearch是框中，用户必须点击实际的搜索框才能显示。

我试过的唯一的东西就是把html上面的Javascript动起来，但是，没有运气，现在我问你们所有的SOF。

来源

2014-01-12 Akash Magoon

错字？ $（”搜索 “）的slideToggle（” 600" ）。 – tilda

只需在最初隐藏的元素上使用CSS“display：none”即可。 –

这是你所需要的：

CSS

.search { display:none;}

$(".clicktosearch").on("click", function(){ 
    $(".search").slideToggle("600"); 
});

我删除了$(".search").hide();，因为它没有显示并可能导致其他问题。（JQuery不需要隐藏已经通过CSS隐藏的东西。）

顺便说一句：如果只有一个元素匹配.search，它应该确实是id等#search。 .clicktosearch也是如此。

来源

2014-01-12 03:40:53

使用css隐藏它。

.search { display:none;}

发生这种情况的原因是在css和HTML生效之后JavaScript会被加载。使用CSS隐藏它，div隐藏之前的时间滞后将更少。

来源

2014-01-12 03:28:59 Rohan

你有.hide的document.ready内，$(function(){是短期的$(document).ready(function() {

因此，只要把它的document.ready之前，它应该工作...

<script type="text/javascript"> 
$(".search").hide();   //moved this line too here 
$(function(){ 
$(".clicktosearch").on("click", function(){ 
    $(".searchr").slideToggle("600");

虽然什么我个人更喜欢只是在你的CSS中隐藏它。

像这样，

.search { display: none; }

来源

2014-01-12 03:29:02 CRABOLO

你得触摸CSS。

.search { 
    height: 0px; 
}

然后，在JavaScript：

$(".clicktosearch").on("click", function(){ 
    $(".search").slideToggle("600"); 
});

来源

2014-01-12 03:29:10 knrz

您需要使用显示：无在CSS最初隐藏它。后在页面加载，以便您始终在JavaScript踢之前看到它简单的JavaScript仅执行

来源

2014-01-12 03:29:40 scf1001

使用javascript隐藏div

回答

相关问题