Servlet 加载一个新页面

Question

我有以下问题：

我有两个 servlet，一个返回一个导航。 servlet 通过 DAO 获得了一些类别和子类别。我使用以下脚本在正确的位置获取 servlet 结果：

$(document).ready(function() {                        
                $('#navigation').load('Navigation');
                $('#content').load('Content');
            });

在我的导航 div 下方，我有一个内容 div。如您所见，我正在加载内容servlet。在我的导航中；我有以下元素：

<li><a><form action='Content' method='get'><button type='submit'>"
                                + k2.getKName() + "</button><input type='hidden' name='category' value='"+ k2.getKategorieNr() + "'/></form></a></li>

现在，当我单击一个子类别时，该按钮将调用内容 servlet。问题是，它加载了一个没有导航的新页面。所以只能在新页面看到servlet返回的代码。

如何在我的前一页中获取内容 servlet 的结果，因为它已经适用于我的导航 servlet？

Answer 1

当您最初加载页面时，$("#navigation").load("Navigation") 向您的Navigation servlet 发出 AJAX 请求，并将来自 servlet 的 HTML 响应粘贴回类似 <div id="navigation"> 的元素中。

当您单击表单中的按钮时，您正在向同一个 servlet 发出顶级完整页面请求，响应内容将替换整个浏览器窗口，而不是像使用 jQuery 那样将其粘贴到页面中load.

解决这个问题的最简单方法可能是使用 jQuery ajaxForm 插件： http://malsup.com/jquery/form/

你会在你准备好的回调中做一些事情，比如

$(document).ready(function() {                        
            $('#navigation').load('Navigation');
            $('#content').load('Content');
            $('#formId').ajaxForm({target: '#content'});
        });

当然，您需要为表单元素添加一个 ID，以便您可以使用 jQuery 轻松找到它。

看 jQuery ajax - change jQuery target value with form submit