2017-05-09 2 views
0

Wie ich im Titel erwähnt in eine jQuery-Funktion gefunden, um eine Schaltfläche zu erstellen, die einen Absatz html ausblenden und anzeigen, aber wenn ich auf meiner Seite gehe ich möchte, dass meine pragraph versteckt werden, jetzt habe ich die inverse .. der Absatz Anzeige von Anfang an istToggle in jQuery, Absatz im ersten verstecken

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
<script> 
$(document).ready(function(){ 
    $("button").click(function(){ 
     $("p").toggle(); 
    }); 
}); 
</script> 
<body> 
    <button>Toggle between hiding and showing the paragraphs</button> 
<p> 
    If you see me it is that you had to click on the button 
</p> 
</body> 
+3

könnten Sie einfach verstecken es mit CSS 'p {display: none; } ' – blex

Antwort

0

Nur hidden Attribut gilt, dass Absatz standardmäßig zu verstecken.

$(document).ready(function() { 
 
    $("button").click(function() { 
 
    $("p").toggle(); 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<button>Toggle between hiding and showing the paragraphs</button> 
 
<p hidden> 
 
    If you see me it is that you had to click on the button 
 
</p>

+0

Das ist keine Option, die ich empfehlen würde, da es in IE10 und darunter nicht unterstützt wird. https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden – blex

+0

@blex Vor einigen Jahren würde ich Ihnen zustimmen. –

+0

Ja, vielleicht mache ich mir zu viele Sorgen, aber ich versuche immer, die größte Auswahl an Browsern zu unterstützen, wenn es so einfach ist ... Wie auch immer, das ist immer noch eine gute Lösung für moderne Browser. – blex

0

Es zu trigger der Click-Ereignishandler nach seiner Definition genug.

$("button").click(function(){ 
 
    $("p").toggle(); 
 
}).trigger('click'); 
 
//^^^^^^^^^^^^^^^^^^
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 

 
<button>Toggle between hiding and showing the paragraphs</button> 
 
<p> 
 
    If you see me it is that you had to click on the button 
 
</p>