0

私は、jquery タブと jPages という 2 つの一般的なテクノロジを使用しています。残念ながら、以下のターゲットは協力していないようです。これは、以下に示した 3 つのページの現在の設定で修正できますか?

$("div.holder").jPages({containerID : "card-row"});

ページ 1 (jquery タブを使用):

<script>
$(function() {
    $( "#tabs" ).tabs({
        beforeLoad: function( event, ui ) {
            ui.jqXHR.error(function() {
                ui.panel.html(
                    "Couldn't load this tab. We'll try to fix this as soon as possible. " +
                    "If this wouldn't be a demo." );
            });
        }
    });
});
</script>
<div id="tabs">
    <ul><li><a href="pages/page-2.php">Your Collection</a></li>
    </ul>
</div>

ページ 2 (ajax を使用):

<script>
$(document).ready(function(){
    $.get("/pages/page-3.php",{}, function(data, statusTxt){
        $('#collection-table .search-results').html(data);
    });
});
</script>
<div id="#collection-table">
    <div class="search-results">
    <!-- get page 3 contents-->
    </div>
</div>

ページ 3:

<script type="text/javascript" src="../scripts/jquery.js"></script>
<script type="text/javascript" src="../scripts/jpage.js"></script>
<script>
  $(function(){
    $("div.holder").jPages({
      containerID : "card-row",
      previous : "?",
      next : "?",
      perPage : 20,
      delay : 20
    });
  });
</script>
<div class="holder">
<!-- pagination pages-->
</div>
<tbody id="card-row">
<!--rows-->
</tbody>
4

0 に答える 0