Este artigo compartilha as operações de logout da JFinal e Bootstrap para você, com o objetivo de introduzir como exibir a caixa de confirmação de logout através da tag A, depois enviar uma solicitação de saída para a JFinal e atualizar a página. As principais dificuldades são os dois pontos a seguir:
1. Se a caixa de confirmação de login aparecer no conteúdo da tag a;
2. Como atualizar a página pop-up correspondente através da tag A.
1. Tecnologia front-end
1. Construa uma tag
Copie o código da seguinte forma: <a href = "$ {ctx}/mem/logout" target = "ajaxtodo" callback = "ajaxdone" atitle = "Você tem certeza de que deseja sair?" id = "user_login_out" style = "preenchimento: 0 6px;"> saída </a>
Perceber:
1. Target = "Ajaxtodo", especifique que a tag A é iniciar uma solicitação através do AJAX.
2. Retorno de chamada = "Ajaxdone", especifique a função de retorno de chamada de tag a tag
3. ATITLE = "Tem certeza de que deseja sair?", Especifique as informações de confirmação
2. Inicialize um evento de tag Ajax
função initui (_box) {var $ p = $ (_ caixa || document); // dwz.ajax.js if ($ .fn.ajaxtodo) {$ ("a [target = ajaxtodo]", $ p) .ajaxtodo (); }}Perceber:
1. Após a conclusão do carregamento da página, execute o método Initui, para que a tag A com o destino seja Ajaxtodo possui o método Ajaxtodo especificado.
3. Ajax Pedido de uma tag
função ajaxtodo (url, retorno de chamada) {var $ callback = retorno de chamada; if (! $. } var forwardurl = window.location.href; if (url.indexof ("?")! = -1) {url + = "& Forwardurl =" + Forwardurl; } else {url + = "? forwardurl =" + forwardurl; } $ .ajax ({type: 'post', url: url, datatype: "json", cache: false, sucesso: $ chamada, erro: yunm.ajaxerror});}Perceber:
1. A Forwardurl registra a página de registro
4. Adicione o método Ajaxtodo ao objeto jQuery
.fn.extend ({ajaxtodo: function () {return this.each (function () {var $ this = $ (this); $ this.click (function (event) {var url = uNescape ($ this.attr ("href")). replacetMbyId ($ (event.target). (! url.isfinishedtm ()) {$ .showerr ($ this.attr ("warn"); $ this.attr ("retorno de chamada"); },});5. Função de retorno de chamada
função ajaxdone (json) {yunm.ajaxdone (json); if (json [yunm.keys.statuscode] == yunm.statuscode.ok || json [yunm.keys.statuscode] == yunm.statuscode.info) {// se a página após a transferência for especificada, gire if (json.forwardurl) {location.href = json. json.nson.fort. }}}6. Caixa de confirmação do WEEbox aparece
$ .showConfirm = function (str, funcok, funcclose) {var okfunc = function () {$ .weeboxs.close ("yunm_confirm_box"); funcok.call (); }; $ .weeboxs.open (str, {boxid: 'yunm_confirm_box', contentType: 'text', showbutton: true, showcâncel: true, showok: true, título: 'confirm', largura: 280, tipo: 'wee', noopen: function () {init_ui_button (); });}; função init_ui_button () {$ ("button.ui-button [init! = 'init']"). cada (função (i, o) {$ (o) .attr ("init", "init"); // para impedir a inicialização repetida de $ (o) .ui_button ();});2. Tecnologia jfinal
public void logout () {if (getSession (). getAttribute ("nome de usuário")! = null) {// clear session getSession (). removeattribute ("nome de usuário"); } Ajaxdonesuccess ("Login com sucesso!"); renderjson ();}Adicione o método de logout.
Efeito:
Se você ainda deseja estudar em profundidade, pode clicar aqui para estudar e anexar 3 tópicos interessantes a você:
Tutorial de aprendizado de bootstrap
Tutorial prático de bootstrap
Tutorial de uso de plug-in bootstrap
O acima é tudo sobre este artigo. Espero que todos possam começar a implementar a caixa de confirmação do sistema de saída de bootstrap + jfinal. Espero que todos gostem deste artigo e obrigado pela leitura.