Question

我正在构建一个链接到数据库的站点，该数据库的接口由选项卡和选项卡中的portlet组成，所有这些都是使用jQuery UI构建的。

main.jsp激活标签：

<script>
    $(document).ready(function() {
        $("#tabs").tabs();
    });
</script>

并且main.jsp中包含的price.jsp文件会激活portlet：

<script>
$(function() {
    $( ".column" ).sortable({
        connectWith: ".column",
        distance: 200,
        containment: 'parent',
        items: "li:not(.ui-state-disabled)"
    });

    $( ".portlet" ).addClass( "ui-widget ui-widget-content ui-helper-clearfix ui-corner-all" )
        .find( ".portlet-header" )
            .addClass( "ui-widget-header ui-corner-all" )
            .prepend( "<span class='ui-icon ui-icon-minusthick'></span>")
            .end()
        .find( ".portlet-content" );

    $( ".portlet-header .ui-icon" ).click(function() {
        $( this ).toggleClass( "ui-icon-minusthick" ).toggleClass( "ui-icon-plusthick" );
        $( this ).parents( ".portlet:first" ).find( ".portlet-content" ).toggle();
    });

    $( ".column" ).disableSelection();
});
</script>

在price.jsp中，在其中一个portlet中，我有表格数据，用户可能希望在数据库记录发生变化时不时刷新，而不刷新该选项卡中的任何其他portlet

所以我在portlet中有一个按钮，表示刷新：

<button onclick="window.location.reload()">Refresh</button>

但是，它的作用是它不仅刷新其他portlet，还刷新整个页面！这不是我的意图。

我认为onclick函数应该类似于

$(this).sortable({update: function(event, ui){ //some code here//} });

但我对jQuery语法不太熟悉。

希望有人可以帮我弄清楚如何更改按钮的onclick功能！

Answer 1

你想要的是一个AJAX请求。看看$.ajax。您需要将表的HTML作为脚本$.ajax请求的响应返回。然后在$('#tableID').html(response)来电的success: function(response)部分内使用$.ajax更新您的表格。

Answer 2

嗨，对于那些偶然遇到此问题第二部分的人（页面没有更新最新的数据库记录），我设法解决了这个问题。

经过多次使用代码后，我发现这确实是一个IE问题。当你第一次打开IE并激活JSP页面时，IE会缓存数据库的视图。因此，当您点击IE刷新按钮时，将反映对数据库的后续更新，而不是使用jquery ajax .load（' .jsp'）函数。当您在打开IE时首次加载JSP页面时，.load（' .jsp'）函数基本上会将您带回到该缓存视图。因此，除非您关闭并重新打开IE，否则用于刷新表数据的刷新按钮将不会在您首次启动JSP页面后更新记录。

解决这个问题的方法是在编写JSP页面脚本之前放置这些代码：

<%
response.setHeader("Cache-Control","no-cache"); //HTTP 1.1
response.setHeader("Pragma","no-cache"); //HTTP 1.0
response.setDateHeader ("Expires", 0); //prevents caching at the proxy server
%>

或标题中的元代码：

<meta http-equiv="Cache-Control" content="no-cache">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content=0>

现在，这种解决方法仅适用于那些有IE问题的人。我已经在chrome上测试了它，刷新按钮功能正常，有或没有上面的代码。你去吧。

jQuery UI：刷新可排序的portlet而不刷新整个页面

2 个答案: