..


Sponsorerede links

Slet elementer fra en liste over animationseffekt med jQuery

Artikel skrevet af Horace Maico
Side 1 af 2

I denne artikel vil jeg forklare hvordan man bruger JQuery biblioteket til at håndtere fjernelse af elementer i en liste med animation effekt.

Eksemplet er givet i denne simple tutorial er inspireret af den virkning på sletning af elementer i opslagstavlen af ​​Facebook-profil (Nice, huh?).

Først vil jeg invitere dig til at oprette en test database består af en enkelt tabel struktureret sådan her: 

 



 CREATE TABLE indlæg (







 msg_id INT PRIMARY KEY AUTO_INCREMENT,

 





 Besked tekst







 );
Vores bord "budskaber", som du kan se, er det kun består af to felter: msg_id, som vil identificere det budskab og budskab, der indeholder teksten, kan disse tilføje flere felter, afhængigt af brugen af scriptet, du ønsker at gøre ' F.eks.

Nu oprette en fil (som vi vil bruge i integration inden for PHP script, der vil skabe andre), hvor vi skal hen for at indstille forbindelsen til vores database: 






 <? Php







 $ Conn = mysql_connect ("HOST", "BRUGERNAVN", "PASSWORD") or die (mysql_error ());







 mysql_select_db ("db_name", $ conn) or die (mysql_error ());







 ?>
Gem filen som "dbconfig.php".
Lad os nu oprette indekset (der vil gem som "index.php") over tilgængelige elementer, hver med en knap til at slette: 





 <html>







 <head>







 <title> poster med virkning Cancela FadeOut </ title>







 <link rel="stylesheet" href="stile.css" type="text/css"/>







 <script type="text/javascript" src="jquery.js"> </ script>







 <script type="text/javascript" src="cancella.js"> </ script>







 </ Head>







 <body>







 <h1> Liste over slettede elementer </ h1>







 <ol class="messaggi">







 <? Php







 / / Forbinder til databasen.

 





 omfatter ("dbconfig.php");









 / / Udvælgelsesforespørgslen beskeder gemt i tabellen MEDDELELSER.

 





 $ Sql ​​= "SELECT * FROM beskeder ordre ved msg_id DESC";

 







 / / Udfør forespørgslen.

 





 $ Result = mysql_query ($ sql, $ conn);

 





 while ($ row = mysql_fetch_array ($ result)) {



  



 $ Besked = stripslashes ($ row ["besked"]);



  



 $ Msg_id = $ row ['msg_id'];



  

  



 / / Visning af resultatet af forespørgslen beskeder som en liste over emner.

 

  



 / / Tilføj en X til hver enkelt funktion for at slette posten.

 

  



 ?>



  



 <li> <? php echo $ besked;?> <a href = "#" id = "<php ​​echo $ msg_id;?>" class = "delete_button"> X </ a> </ li>



  



 <? Php







 }







 ?>







 </ Ol>







 </ Body>







 </ HTML>
Som allerede sagt til hvert element på denne liste har tilknyttet et link (i mit eksempel brugte jeg en simpel X) vi forbinder - en metode til at bruge jQuery - delete funktionen.

I den samme kategori ...
E-Learning
ASP Zero (Ebook) ASP Zero (Ebook)
Læring Microsoft ASP og VBScript fra bunden. På kun 29 €.
Javascript (Kursus) Javascript (Kursus)
Komplet guide til klient-side scripting. Fra 39 €.
PHP (Kursus) PHP (Kursus)
Fuld kursus for at skabe dynamiske web-sites. Fra 49 €.
Sponsorerede links