Jquery mobile动态生成ListView调用刷新方法报错

错误：cannot call methods on listview prior to initialization...

 

示例：

<div data-role="page" id="page">
    <div data-role="header">
        <a href="#" onclick="history.back();" data-ajax="false"
            class="ui-btn-left ui-btn ui-btn-inline ui-mini ui-corner-all ui-btn-icon-left ui-icon-arrow-l">返回a>
        <h1>当天的巡查任务h1>
        
    div>

    <div class="ui-corner-all custom-corners">
        <div class="ui-bar ui-bar-b">
            <h3>巡查日志h3>
        div>
        <div class="ui-body ui-body-a">
            <button class="ui-btn" onclick="newLog();">新建巡查日志button>
            <ul data-role="listview" id="xcrzList" data-inset="true">ul>
        div>
    div>

    <div class="ui-corner-all custom-corners">
        <div class="ui-bar ui-bar-b">
            <h3>巡查记录h3>
        div>
        <div class="ui-body ui-body-a">
            <button class="ui-btn" onclick="newInfo();">新建现场巡查记录button>
            
            <ul data-role="listview" id="xcxxList" data-inset="true">ul>

        div>
    div>
div>

报错代码：

$('#xcxxList').listview("refresh");
$('#xcrzList').listview("refresh");

分析原因：

因为page容器是动态生成的。page数据加载至容器时，jquerymobile并没有对该page容器进行初始化。因此调用 page的content下的listview组件的refresh方法时，会出现异常。

 

解决方法：

在dom数据加载完成后，重新生成page

$('#page').page();
$('#xcxxList').listview("refresh");
$('#xcrzList').listview("refresh");

转载于:https://www.cnblogs.com/lkc9/p/9953980.html