在选项卡内容中重新加载 div 元素的内容答案

【问题标题】：Reloading content of a div element in a tab content在选项卡内容中重新加载 div 元素的内容
【发布时间】：2014-02-03 15:43:32
【问题描述】：

我已经定义了 2 个选项卡，并且在例如“#tabs-2”中我有一个“div”元素 ()，当我单击选项卡 2 时我想刷新它。我只需要刷新那个 div 而不是整个页面。

<html>
<head>
<script>
    $(function() {
    $( "#tabs" ).tabs();
        });
</script>
</head>
<body>
   <div id="tabs">
        <ul>
            <li><a href="#tabs-1" id="tabs-1">first</a></li>
            <li><a href="#tabs-2"  id="tabs-2">second</a></li>

        </ul>
<div id="tabs-1">
<p>tab-1 content</p>
</div>

<div id="tabs-2">
<html>
    <head>
    </head> 

        <body>
          **<div class="container-fluid"></div>**
        </body>
</html>

</body>
</html>

【问题讨论】：

标签： jquery html tabs refresh

【解决方案1】：

我认为这会对您有所帮助：Refresh a div with jQuery

另一种解决方案是像这样对每个标签使用部分视图

<div id="tabs">
    <ul>
        <li><a id="action-tab1" href="#tabs-1">My TAB 1</a></li>
        <li><a id="action-tab2" href="#tabs-2">My TAB 2</a></li>
        <li><a id="action-tab3" href="#tabs-3">My TAB 3</a></li>
    </ul>

    <div id="tabs-1">
        @Html.Partial("_MyPartialView1")
    </div>
    <div id="tabs-2">
        @Html.Partial("_MyPartialView2")
    </div>
    <div id="tabs-3">
        @Html.Partial("_MyPartialView3")
    </div>
</div>
<script>
  $(function() {
  $( "#tabs" ).tabs();
   $("#tabs-2").click(function()
   {
      // DO YOUR REFRESH WORK HERE
   });
 });
</script>

【讨论】：