JavaScript zeigt keine Elemente an, die mit CSS ausgeblendet werden

-1

Ich habe eine Seite, die alle außer dem ersten Element verstecken muss. Das erste Element bleibt jedoch weiterhin verborgen, obwohl ich JS sage, es zu zeigen.JavaScript zeigt keine Elemente an, die mit CSS ausgeblendet werden

Der Code funktioniert auf dieser Seite fein: als das erste div gezeigt wird (obwohl es Inline-CSS ist zu sagen „display: none“)

jedoch mit dieser Testseite, ist es nicht zeigen jedes Element. Wenn ich das Inline-CSS-Sprichwort "display: none;" natürlich wird es das erste Element zeigen, aber dann kann ich nicht sicher sein, dass der Rest des JS funktioniert. Ich beginne mit diesem Codeblock zu Testzwecken. Hier

ist der Code:

<!DOCTYPE html> 
<html lang="en"> 
<body> 

     <script type="text/javascript"> 
    function pageLoad() { 


     document.getElementById("one").style.display = ""; 
     document.getElementById("two").style.display = "none"; 
     document.getElementById("three").style.display = "none"; 
    }  

</script> 


    <div> 
    <div> 
    <div>  
    <h1> Junk </h1> 
     <p>stuff </p> 


     <div id="one" style="display:none;"> <p>hjdshfjshjshjsdjfskfsdkjf</p></div> 
     <div id="two" style="display:none;"> <p>hjdshfjshjshjsdjfskfsdkjf</p></div> 
     <div id="three" style="display:none;"> <p>hjdshfjshjshjsdjfskfsdkjf</p></div> 
    </div> 
    </div> 
    </div> 


</body> 

</html>

Quelle

2016-05-18 abtecas

Sie scheinen nicht 'pageLoad()' ... aufzurufen? –

Warum schreiben Sie nicht einfach einen CSS-Code, um das erste anzuzeigende Element zu definieren? –

Das ist meine anfängliche Neigung, jedoch muss der Code (der nicht von mir stammt) getestet werden, da er bereits existiert. (Es wird eine Reihe von bekannten funktionierenden Code, der bereits vorhanden ist, der angehängt werden muss) – abtecas

Wenn Sie den Body-Tag dies ändern könnte, verwenden:

<body onload="pageLoad()">

Aber, wenn es sich um ein Teil-Code ist und Sie wollen nicht den Body-Tag ändern, füge das einfach am Ende deines Codes hinzu:

<script> 
    pageLoad(); 
</script>

Quelle

2016-05-18 16:38:26 Mojtaba

In Ihrem Körper Tag-Aufruf pageload

<body onload="pageLoad()"> 
....

Quelle

2016-05-18 16:33:12

Danke für das Schauen, aber es nennt es nicht auf dieser Seite https://www.dinnerthyme.com/yo-join.aspx und aber es funktioniert gut. – abtecas

Ihr Code funktioniert gut mit mir sicher, dass Ihr pageload() Funktion aufzurufen,

<body onload="pageLoad()">

siehe Arbeitsdemo: http://jsbin.com/xeribupora/edit?html,output

Quelle

2016-05-18 16:33:42

Et voila!

function pageLoad() { 
 

 

 
     document.getElementById("one").style.display = ""; 
 
     document.getElementById("two").style.display = "none"; 
 
     document.getElementById("three").style.display = "none"; 
 
    }

<!DOCTYPE html> 
 
<html lang="en"> 
 
<body onload="pageLoad();"> 
 

 

 
    <div> 
 
    <div> 
 
    <div>  
 
    <h1> Junk </h1> 
 
     <p>stuff </p> 
 

 

 
     <div id="one"><p>hjdshfjshjshjsdjfskfsdkjf</p></div> 
 
     <div id="two"><p>hjdshfjshjshjsdjfskfsdkjf</p></div> 
 
     <div id="three"><p>hjdshfjshjshjsdjfskfsdkjf</p></div> 
 
    </div> 
 
    </div> 
 
    </div> 
 
</body> 
 
</html>

Quelle

2016-05-18 16:34:07

Es gibt mehrere Möglichkeiten, dies zu tun s.

In Css

p div:nth-of-type(n+1){ 
    display:none; 
}

In Javascript

window.onLoad=function(){ 
document.getElementById("one").style.display = ""; 
document.getElementById("two").style.display = "none"; 
document.getElementById("three").style.display = "none"; 

};

Ich weiß nicht, ob dies von großem Nutzen ist though.:-/

Quelle

2016-05-18 16:38:55

Wie bereits erwähnt, müssen Sie pageload() aufrufen . Hier eine Möglichkeit, JavaScript zu verwenden:

window.addEventListener("load", function load(){ 
    window.removeEventListener("load", load, false); 
    pageLoad(); 
},false);

Quelle

2016-05-18 16:41:18 MSoRMvzH8g

yoooooooooooooo – J843136028

JavaScript zeigt keine Elemente an, die mit CSS ausgeblendet werden

Antwort

Verwandte Themen