Slik skjuler en DIV på en tilbakesending i Javascript

Slik skjuler en DIV på en tilbakesending i Javascript


Ved hjelp av en postback metode for å skjemaene --- hvor samme side begge inneholder skjemaet og behandler det --- kan bidra til å forenkle koden din og opprettholde et konsistent brukergrensesnitt og brukeropplevelse. Som en del av tilbakesendingsprosessen, men du vil sannsynligvis ønske å skjule noen sideelementer; for eksempel, kan det være lurt å bare gjøre <div> som inneholder selve skjemaet synlig første gang, ved hjelp av sendings visning av siden for å tillate brukeren å bekrefte deres innspill før du sender den en siste gang. Hvis du vil skjule en div på postback, vil du bruke Javascript, analyseres av noen enkle PHP.

Bruksanvisning

1 Åpne PHP-filen som inneholder skjemaet HTML og koden håndtering av postback metodikk. Bla ned til <div> som du ønsker å skjule, og noterer det er "id" eller unik identifikator (for eksempel "id = 'div_to_be_hidden'» markerer en <div> med den unike id "div_to_be_hidden" ). Hvis <div> har i dag ikke en, legge en id-attributt til koden.

2 Kopier og lim inn følgende linje med kode som første linje i sidens kildefilen, gjør ingen endringer i det på forhånd:

<? Php if (isset ($ _ POST [ "postback_check"])) {$ postbackhide = "<script type = \" text / javascript \ "> \ n document.getElementById ( '". $ _ POST [ "postback_check"]. " ') .style.display =' none '; \ n </ script>"; } Else {$ postbackhide = "";}>?

Dette PHP-kode legger noen Javascript som kontekstuelt vil sjekke om siden er i startskjermbildet eller postback-modus, og skjule en spesifisert div riktig.

3 Flytt ned i dokumentet til selve skjemaet, preget av "<form>" start og "</ form>" end-koder. Legg en inngang element med den type "skjult", navnet "postback_check" og en verdi lik id av <div> som du vil skjule. For eksempel, hvis <div> ble kalt "div_to_be_hidden," du vil legge til følgende innspill til skjemaet:

<Input type = "hidden" name = "postback_check" value = "element_to_hide">

4 Legg til en kort linje med kode ringe Java opprettet i PHP-funksjonen på siden første linje. Det er lurt å legge dette rett under <div> du ønsker å skjule, slik at koden vil kjøre etter <div> er lastet inn på siden minne. Kopier og lim inn denne koden, gjør ingen endringer til det:

<? Php echo $ postbackhide; ?>

5 Lagre dokumentet og lukker redaktøren. Når du laster skjemaet, <div> vises som normalt; på postback, vil den skjulte "postback_check" -feltet utløse initialisering PHP, og legger den nødvendige Javascript for å skjule <div>, ved hjelp av Javascript-tallet "style.display" egenskaper.