Question

我有一个手风琴的页面。当您打开其中一个面板时，它会列出指向该网站上其他页面的各种链接。如果您点击其中一个链接，目标页面将在灯箱中打开，用户将进行更改并在此灯箱中提交表单。提交更改后，灯箱将自动关闭，父页面将重新加载。重新加载是必要的，因为它显示了灯箱中更新的值的摘要，因此无需重新加载摘要，它只显示旧值。问题是我需要先前活动的面板返回到该状态。是否有捷径可寻？或者，是否可以仅重新加载包含更新数据的div，以便不重新加载整个页面？我的代码如下（面板2处于活动状态）：

   <script type="text/javascript">
   // Refreshes the page. Called from the page shown in the lightbox
      function refreshPage() {      
      // reload
      window.location.reload();
      }
   </script>

<div id="container">   
   <div id="panelOne">
      <div class="Accordion ui-accordion" role="tablist">
         <h3 class="AccordionHeader ui-state-default" role="tab" aria-expanded="false"     aria-selected="false" tabindex="0">
            <div><span><a href="javascript:void(0)" tabindex="-1">Panel One</a></span>    </div>
         </h3>
         <div class="AccordionContent" role="tabpanel" style="display: none;">
            <div id="Content1">

            </div>
         </div>
      </div>

   </div>
   <div id="panelTwo">
      <div class="Accordion ui-accordion" role="tablist">
         <h3 class="AccordionHeader ui-state-active" role="tab" aria-expanded="true"     aria-selected="true" tabindex="0">
            <div><span><a href="javascript:void(0)" tabindex="-1">Panel Two</a></span>    </div>
         </h3>
         <div class="AccordionContent ui-accordion-content-active" role="tabpanel"         style="display: block;">
            <div id="Content2">

            </div>
         </div>
      </div>

   </div>
   <div id="panelThree">
      <div class="Accordion ui-accordion" role="tablist">
         <h3 class="AccordionHeader ui-state-default" role="tab" aria-expanded="true"     aria-selected="true" tabindex="0">
            <div><span><a href="javascript:void(0)" tabindex="-1">Panel Three</a>        </span></div>
         </h3>
         <div class="AccordionContent" role="tabpanel" style="display: none;">
            <div id="Content3">

            </div>
         </div>
      </div>
   </div>

Answer 1

jQuery的.load（）将允许您只获取文档的一部分。请参阅：http://api.jquery.com/load/

例如：

$('#summary').load('somepage.html #summary > *');

将页面somepage.html中元素#summary的内容加载到当前元素#summary

页面重新加载后，使用jquery重新打开上一个活动的折叠面板

1 个答案: