Em projetos, frequentemente encontramos segmentação de páginas, a interface principal mais comum de um sistema ou site. A página principal é dividida em introdução do sistema na parte superior, introdução do autor na parte inferior, menu de funções do sistema à esquerda e interface onde o menu é realmente exibido à direita.
Ao encontrar esse tipo de página dividida, a primeira coisa que todos pensam é no conjunto de quadros. Usar o conjunto de quadros para dividir vários quadros é um método simples. Se você não gosta de usar conjuntos de quadros, as pessoas que gostam de design front-end podem escolher p splicing e flutuante, o que testará suas habilidades de estilo CSS.
Desta vez explicamos principalmente a questão da atualização parcial. Os requisitos são: quadro esquerdo, quadro direito.
Você deve estar se perguntando: não há problema em atualizar assim. De fato. Agora use o conjunto de quadros para dividir os dois quadros e atualizar cada um. Basta atualizar e enviar o menu exibido no quadro à direita. Não tem efeito no quadro esquerdo.
Para facilitar a compreensão, o quadro esquerdo é chamado de LeftFrame e o quadro direito é chamado de RightFrame; se eu enviar a página RightFrame, preciso atualizar a página LeftFrame [Dynamic]. O que fazer?
Na verdade, significa reler os dados do banco de dados;
Entre eles, modificarMenu!showTreeMenu é redirecionado para a página tree.jsp
No projeto atual, o struts2 é usado na recepção. Quando os dados da página certa são enviados, a ideia é: então pular novamente para a interface principal, o que equivale a reler os dados, mas a interface principal carregada. é realmente exibido na área direita, tornando-se dois LeftFrame. Mesmo alterar o redirecionamento de resultType no Struts2 não funciona.
Finalmente, um simples JS resolveu o problema.
Depois de enviar o RightFrame na página direita, use JS para atualizar o LeftFrame na esquerda. do seguinte modo:
O evento onload do corpo em rightFrame:
window.parent.frames["leftTree"].location.reload()
Quando você chegar ao fim de uma determinada linha de pensamento, poderá tentar mudar sua linha de pensamento e verá um futuro brilhante.
Os requisitos são os seguintes: Se você atualizar a página RightFrame direita, atualize apenas parte do LeftFrame esquerdo [atualizar um determinado p].
Quando se trata de atualização parcial, a atualização parcial do Ajax deve vir à mente.
Em seguida, usamos a implementação básica js Ajax pura:
função inicialização(){
//Executa atualização parcial
var xmlHttpReq=createXmlHttpRequest();
//Obtém o URL inicial, como ação struts2 ou servlet ou página jsp
var url="sucesso.jsp";
xmlHttpReq.open("GET",url,true);
//Como você está fazendo uma chamada assíncrona,
//Então você precisa registrar um manipulador de eventos de retorno de chamada que o objeto XMLHttpRequest irá chamar
xmlHttpReq.onreadystatechange=função(){
if(xmlHttpReq.readyState==4){
if(xmlHttpReq.status==200){
//Use parent para obter um p na página esquerda e então altere a aparência do display
window.parent.frames["leftTree"].document.getElementById(pId).innerHTML="Teste";
}outro{
alerta(xmlHttpReq.status+xmlHttpReq.responseText);
}
}
};
xmlHttpReq.send(nulo);
}
window.parent.frames["leftTree"].document.getElementById(pId).innerHTML=xmlHttpReq.responseText
O método de escrita na ação em segundo plano é o seguinte:
Dois métodos de atualização, uma atualização geral;