0

こんにちは、各タブ内により多くの機能をロードするphp ajaxタブのリファレンス/サンプルはありますか？2つのタブがあり、各タブをクリックすると、各結果の最後にある[さらに読み込む]ボタンをクリックするまで、選択した数の結果のみが表示されるとします。ありがとう。現在のコードはうまく機能していないようです。各タブをクリックすると結果が正しく表示されますが、タブをもう一度クリックするとさらにデータが読み込まれます。現在のコードは次のとおりです。

<li data-tab-id="self" class="tab selected"><a href="#">Near You</a><span class="unread-count hidden" style="display: none;"></span></li>


<li data-section-id="user_feed" data-component-bound="true">
    <ul class="module-list">                            
    <!-- USER ACTIVITY JSON -->
    </ul>
    <a class="ybtn ybtn-primary ybtn-large more-wishlist" href="#" onclick="getRecentActivityClick(event)">
    <span data-component-bound="true" class="loading-msg user_feed">See more recent activity</span>
    </a>
</li>

<script type="text/javascript">
var totalRecords = '<?= $this->totalRecords?>';
$(document).ready(function(){
getRecentActivity(totalRecords);
});

$(".hd-ui-activity li a").click(function(e) {
e.preventDefault();
var tabid = $(this).parent().attr('data-tab-id');
if(tabid == "self"){
        getRecentActivity(totalRecords);

    }
});

function getRecentActivityClick(event)
{
    if (event != null){
            disabledEventPreventDefault(event);
        }
        getRecentActivity(totalRecords);
}

home.js：

function getRecentActivity(totalRecords)
{
$.ajax({
        url:baseUrl + "activity/activityfeed",
        data:{'total':totalRecordsView},
        dataType:"json",
        type:"POST",
        success:function(data){

 var activityHtml = '<p>Hello</p>';
$('#activity-feed li[data-section-id=near_you] .module-list').append(activityHtml);


}
});

}

更新：JSFIDDLE：http ://jsfiddle.net/zlippr/5YkWw/1/

4

2 に答える 2

0

あなたの質問から私が理解したことで..あなたが使用しているので、より多くのデータを取得していると思います.. append()..使用html()

append() は、パラメーターで指定されたコンテンツを、一致した要素のセット内の各要素の末尾に挿入します。

html() を使用して要素のコンテンツを設定すると、その要素に含まれていたコンテンツはすべて新しいコンテンツに完全に置き換えられます。

これを試して

交換

$('#activity-feed li[data-section-id=near_you] .module-list').append(activityHtml);

と

$('#activity-feed li[data-section-id=near_you] .module-list').html(activityHtml); //html()
于 2013-01-15T11:28:24.050 に答える
0

あなたはこれを行うことができます：

 $('#activity-feed li[data-section-id=near_you] .module-list').append(activityHtml);
 // here you are appending the fulldata just apply some css here

css を次のように使用します。

$('#activity-feed li[data-section-id=near_you] .module-list')
    .css({'height':'300px','overflow':'hidden'})
    .append(activityHtml);

次にロードモアをクリックします。

$('your load more button').toggle(function(){
   $('#activity-feed li[data-section-id=near_you] .module-list')
    .css({'height':'auto','overflow':'auto'})
    },function(){
   $('#activity-feed li[data-section-id=near_you] .module-list')
    .css({'height':'300px','overflow':'hidden'});
});
于 2013-01-15T11:54:38.047 に答える