【问题标题】:CSS missing on AJAX loading [duplicate]AJAX 加载时缺少 CSS [重复]
【发布时间】:2012-08-27 16:57:27
【问题描述】:

可能重复:
jQuery Mobile styles for an asynchronously included div
Jquery mobile listview - check initialization is complete

我有一个移动 jquery 列表视图,最后有一个 LOAD MORE 按钮。一切正常,只是使用 AJAX 添加的新结果中缺少 css。

这是我的按钮代码

<div data-role="fieldcontain">
            <a onclick="loadmore(this);" type="button" id="showmore" href="#more">Load more..</a>
        </div>

Javascript

function loadmore(a) {
    jq("#show_more_btn").removeClass("show_more_btn");
    jq("#show_more_btn").addClass("loading_btn");
    jq("this").css("display", "none");
    if (null == jq.cookie("bp-activity-oldestpage")) jq.cookie("bp-activity-oldestpage", 1, {
        path: "/"
    });
    var b = jq.cookie("bp-activity-oldestpage") * 1 + 1;
    jq.post(ajaxurl, {
        action: "activity_get_older_updates",
        cookie: encodeURIComponent(document.cookie),
        page: b
    }, function (a) {
        jq("#show_more_btn").removeClass("loading_btn");
        jq("#show_more_btn").addClass("show_more_btn");
        jq.cookie("bp-activity-oldestpage", b, {
            path: "/"
        });
        jq("li[class='load-more']").hide();
        jq("#activity-stream").append(a.contents);
    }, "json");
    return false
}

正确列表视图的屏幕截图 http://s12.postimage.org/yd2hsk119/original.jpg

问题 http://s17.postimage.org/81ofaf1bz/got.jpg

编辑: 列表视图代码

<div class="content-primary">   
            <ul data-role="listview"  id="activity-stream">
    <?php endif; ?>

    <?php while ( bp_activities() ) : bp_the_activity(); ?>

        <?php locate_template( array( 'activity/entry.php' ), true, false ); ?>

    <?php endwhile; ?>

    <?php  if ( empty( $_POST['page'] ) ) :  ?>

            </ul>
        </div>

Entry.php

<li id="activity-<?php bp_activity_id(); ?>">
<a href...>...</a>
<h3>...</h3>
<p>...</p>
</li>

谁知道问题出在哪里?

【问题讨论】:

标签: jquery ajax jquery-mobile


【解决方案1】:

你需要像this一样刷新listview

$("ul").listview('refresh');

您正在将元素添加到列表中,但它们没有被 jQuery mobile 设置样式,因为它们没有正确的类和属性。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2013-08-28
    • 1970-01-01
    • 2022-01-17
    • 2021-07-14
    • 1970-01-01
    • 2019-02-28
    • 2020-04-17
    • 2022-11-10
    相关资源
    最近更新 更多