Question

使用jQuery Mobile创建应用程序，我想要一个页面从服务器加载数据，我在加载时由于各种原因在PHP中构建列表项。

因此，当我第一次加载页面时，一切顺利，如果我再次加载，数据重新插入，但标记不会增强。

SO上有几个主题可以解决这个问题，但是接受的答案总是使用.trigger（'create'）。这个我已经完成但是我没有成功，我尝试过使用.listview（'refresh'）,. strigger（'updatelayout'），我尝试在页面上触发这些事件，该类为页面，listview div，把它放在完整的：我的ajax调用但没有。所以我求助于你们社区：

我正在使用jQM 1.1.1：如果您需要更多信息，我会错过一些我很乐意提供的信息：

这是我的头版

<div data-role="page" id="frontPage">
    <div data-role="header" data-theme="e" data-id="commonHead" data-position="fixed">
        <a href="index.html" data-role="button" data-icon="home" data-iconpos="notext"></a>
        <h1>
            myApp
        </h1>
    </div>
    <div data-role="content" class="content">
        <ul data-role="listview">
            <li><a href="#" onClick="viewfList()">List</a></li>
        </ul>
    </div>
</div>

以下是我导航到的页面：

<div data-role="page" id="fView">
    <div class="commonHeader"></div>
    <div data-role="content">
        <ul data-role="listview" id="fList">

        </ul>
    </div>
</div>

这是我用来调用页面的viewfList函数

function viewFeatList(){
    jQuery.ajax({ //getting my new <li>
            url: 'http://sources.mysource.com/get_list.php',
            type: 'POST',
            //data: myData,
            dataType: 'jsonp',
            jsonp: 'jsoncallback',
            success: function(data, textStatus, jqXHR){     
                $('#fList').empty(); //emptying the listview                
                for (i=0;i<data.f.length;i++){
                    $('#fList').append(data.f[i]); //appending the <li>
                    }
                $('#fList').trigger('create'); //this version's attempt to re-enhance markup
                $.mobile.changePage('#fView');   //navigate to page                         

                },
            error:  function(jqXHR, textStatus, errorThrown){
                myAlert('There was an error submitting your request')
                }
            });

    }

Answer 1

好的，感谢评论的灵感，并且由于沮丧而克服了我自己的疏忽，我找到了解决方案：

这是我的新功能

function viewfList(){
    jQuery.ajax({
            url: 'http://sources.mysource.com/get_list.php',
            type: 'POST',
            //data: myData,
            dataType: 'jsonp',
            jsonp: 'jsoncallback',
            success: function(data, textStatus, jqXHR){     
                $('#fList').empty();;               
                for (i=0;i<data.f.length;i++){
                    $('#fList').append(data.f[i]);
                    }

                $.mobile.changePage('#fView');  
                $('#fList').listview('refresh');                                            
                },
            error:  function(jqXHR, textStatus, errorThrown){
                myAlert('There was an error submitting your request')
                }
            });

    }

原来.listview（＆＃39; refresh＆＃39;）确实有效，但确实根据CrimsonChin的建议在Javascript控制台中抛出了一个错误但我正在执行这些错误页面不是实际的listview元素。当我在listview元素上执行它时，我收到了这个错误：

Uncaught在初始化之前无法调用listview上的方法; 试图调用方法＆＃39;刷新＆＃39;

显然，这导致我在页面更改为后调用刷新。

我唯一担心的是：如果有一天页面上有很多事情要做，我是否有可能在屏幕上看到未增强的标记闪存，在它发生变化之前一瞬间......现在不会发生，但我暂时正在运行一个非常基本的页面。

感谢您的帮助。

来自php的jQuery Mobile加载标记 - 第二次不会增强标记

1 个答案: