java - Ajax导航问题后退按钮

标签 java javascript jquery spring spring-mvc

我在 Java Spring 框架中有一个基于 Ajax 的选项卡切换应用程序,我必须处理后退按钮场景。通过下面指定的代码成功完成了现在面临的效果是首页加载,而不是针对特定历史记录选择的选项卡出现选项卡切换跳转。如果有人对此提供帮助,那就太好了,谢谢。

var innerTab = "";
function navigateAjaxHtmlSetup(target,response){
        if (typeof target == 'undefined') 
        target = "#ajax-container";  
        $(target).html(response);
        $("input[check-with-select]:checked").parent("label").parent("td").nextUntil(":last").find('select').attr('required', 'required');
        $(target).focus();
        $("#ajax-loader").hide();    
}
function pushStateToHistory(){
    var history = window.history;
    var location = window.location.pathname;
    history.pushState({}, "GHFP", location+activeTabs());
}

function anchorAjaxCall(self,url,state){
        $.ajax({
            type: 'GET',
            url: url,
            dataType: "html",
            success: function (response) {
                var target = self.attr('targeto');
                navigateAjaxHtmlSetup(target,response);
                if (state)
                    pushStateToHistory();
//              if(innerTab != ""){
//                  var anchor  = $("a#"+innerTab);
//                  innerTab = "";
//                  anchorAjaxCall(anchor,anchor.attr('href'));
//              }
            }
        });
}

function activeTabs(){
    selectedTabList = $(".tabs-nav a.active");
    var activeURL;
    if (selectedTabList.length > 0){
        activeURL="#";
        selectedTabList.each(function(index,el){
            activeURL +="/"+$(el).attr('id');
        });
    }else{
        activeURL="";
    }   
    return activeURL;
}

function urlAjaxNavigationHandling(hash){
    if (hash.indexOf('/')!=-1)
    {
        var selectedTabList = hash.substring(1,hash.length).split('/');
        var anchor  = $("a#"+selectedTabList[1]);
        anchorAjaxCall(anchor,anchor.attr('href'),false);
        if (selectedTabList.length > 1)
            innerTab = selectedTabList[2];
    }  
}
window.onpopstate = function(e) {
    urlAjaxNavigationHandling(window.location.hash);
};

虽然我的问题根本与 Spring 或 Java 无关,但如果有人通过 google 搜索来实现 Ajax 基础应用程序,我只是将它们指定为标记。这可能对他有帮助,因为我在 Spring 框架中没有找到任何对 JQuery 的内置支持(如 Ruby on Rails)

最佳答案

Spring Framework 与 Rails 不同,Grails 更接近 Rails,但与 Groovy 更接近。

您的问题的解决方案基本上是使用浏览器的历史记录,正如您已经在尝试的那样。我唯一可以补充的是你应该看看 HTML5 History API http://diveintohtml5.info/history.html还可以考虑使用像http://backbonejs.org/这样的js框架它已经支持路由器。

关于java - Ajax导航问题后退按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13602452/

相关文章:

java - EntityClass 中的 LocalDate 扰乱了 sonarQube

javascript - 如何验证 einaros 的 ws websocket 包上的原始 url

javascript - 将 MySQL 查询结果传递给 Django 中的 Javascript/Jquery

java - 自定义具有多个系列、轴和形状的图表

java - 在 Android 中组合整数常量是如何工作的?

java - 如何处理播放音频文件时的运行时异常?

javascript - 使用 Jquery 顺序运行两个 javascript 函数

javascript - 如何在使用 react(redux) 渲染之前设置状态

jquery - jQuery 顶部与底部位置的奇怪行为

jquery - 向下滚动页面当前视口(viewport)的高度