Misture Ajax em HTML com o Intercooler.js
Nunca foi tão fácil adicione o Ajax a qualquer site. Na verdade, é bastante comum construir sites inteiros baseado em torno de pedidos de Ajax chamado Aplicativos de uma única página (ou SPAs).
No entanto, isso sempre exigiu um pouco de jQuery e algumas disputas técnicas para atualizar o conteúdo da página. Se você só precisa de algum funcionalidade básica do Ajax você pode usar intercooler.js para misturar isso diretamente no seu HTML.
O Intercooler permite escrever atributos HTML que conter nativamente URLs de solicitação do Ajax. Quando os usuários clicam em certos links, você pode ditar isso Solicitações Ajax são executadas em vez da ação de clique normal.
Isso tudo depende dos atributos data-* do HTML5 tal como ic-post-to. Você pode adicionar esse atributo a um botão ou a um link de âncora e Conecte-se automaticamente ao jQuery para uma solicitação POST Ajax.
Na verdade, há uma página cheio desses atributos no site do plugin. Aqui está um pouco de Código de amostra para ver como fica:
Clique em mim!
Isso seria enviar uma solicitação POST do Ajax para o URL / buton_click, e carregar a resposta no elemento recipiente. O Intercooler é uma biblioteca bastante simples e incrivelmente poderosa quando você entende como funciona.
Concedido isso não vai resolver todos os seus problemas de Ajax porque Não é possível atualizar automaticamente outras áreas da página. Isso também não é possível adicionar muitos recursos personalizados sem abrandar a página, por isso um SPA deve realmente use o código Ajax personalizado.
Intercooler.js oferece uma mais maneira semântica para escrever código Ajax para que ele carregue e até ofereça um retorno nativo.
Para instalar o intercooler você só precisa de um cópia do jQuery junto com um cópia da biblioteca intercooler que pode ser encontrado no GitHub. Você também pode teste sem fazer o download quaisquer arquivos usando um CDN jQuery e o Intercooler CDN local.
Coloque ambos em um >
Dê uma olhada no página de demonstrações ver um lista completa de demonstrações você pode brincar. Eu gosto especialmente da demonstração 'Click to Edit' porque mostra exatamente o que é possível e até onde você pode levar este plugin.
Se você estiver interessado em aprendendo mais Confira a guia de referência cheio de atributos HTML do intercooler. Cada um executa uma ação diferente por isso é crucial estudar todos eles e ver o que cabe melhor para o seu cenário.
Naturalmente, você pode encontrar todo o código fonte gratuitamente no GitHub junto com um breve guia de instalação.
