Question

我使用$（＆＃39;＃tab-content＆＃39;）。load（＆＃39; /embed_tab.html'）;加载到页面下方，输出是在项目符号而不是标签？这是我点击父页面上的内容时加载的页面。我该如何解决这个问题。

脚本

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css">

从头部加载。

    <div data-role="tabs" id="detail-tabs">
    <div data-role="navbar">
        <ul>
          <li><a href="#sellpoint" data-ajax="false" class="ui-tab-left ui-btn-active">Selling Point</a></li>
          <li><a href="#terms" data-ajax="false" class="ui-tab-right">Terms of Use</a></li>
        </ul>
      </div>
    <div id="sellpoint" class="ui-body-d ui-content">
        <h1>Selling Point</h1>
    </div>
    <div id="terms">
        <h1>Terms of Use</h1>
    </div>
    </div>

Answer 1

我假设你也在加载jQM javascript以及css。

$（＆＃39;＃tab-content＆＃39;）。load（＆＃39; /embed_tab.html'）;完成后，您必须初始化选项卡小部件以使其得到增强。因此，一旦加载完成，请尝试调用类似：

$('#tab-content').enhanceWithin();

或

$('#tab-content [data-role="tabs"]').tabs();

编辑：在加载完成后调用这些函数，使用load方法的完整回调函数：

$('#tab-content').load('/embed_tab.html', function() {
  $('#tab-content').enhanceWithin();
});

API DOC：http://api.jquery.com/load/

在移动页面中动态添加选项卡内容

1 个答案: