Páginas

terça-feira, 30 de outubro de 2012

Inserindo conteúdo dinâmico com JQuery

A biblioteca jquery facilita muito o trabalho em tornar nossas interfaces mais interativas.
Nesse exemplo mostrarei como adicionar conteúdo dinamicamente na página.

Essa funcionalidade é importante em várias situações, como adicionar novos itens, novos campos para preenchimento etc.

Nesse exemplo vamos inserir novos campos de preenchimento de um cadastro

Vamos ao código:

<html>
   <head>
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>
   </head>
   <body>
      <input onclick="$('#conteudo').append('Novo Item: <input type=text /><br/>');" type="button" value="Adicione mais itens" />
      <div id="conteudo"></div>
   </body>
</html>

Testando o código:







O Evento onclick do input irá acionar o método append do jquery, esse método adiciona um conteudo dentro e ao final de um elemento.
Adapte esse exemplo a suas necessidades,

Gustavo Marques.


Veja mais detalhes
 

Nenhum comentário:

Postar um comentário

Veja também

Related Posts Plugin for WordPress, Blogger...