javascript - 2 RSS feeds inside on one webapp

Question

所以首先了解一些背景知识，所以我有一个名为“事件”的页面，其中有一个 ListView :

 <div class="content-primary">
            <ul data-filter="true" data-icons="false" data-role="listview"
            id="linksList" style=
            "white-space:normal; margin-right: -550px; padding-right: 0px;">
            </ul>
        </div>

此 ListView 过去由我的 RSS 订阅阅读器填充(我将在下面发布代码)但这一切都有效我的事件页面可以由我选择的任何 RSS 订阅填充。

当我尝试复制我的代码并为其创建第二页时，问题就出现了。首先我会得到错误:

无法在初始化之前调用 ListView 的方法；试图调用方法“刷新”

经过一些谷歌搜索后，我发现它可以通过首先通过更改来初始化 ListView 来修复 这个

$("#linksList").listview("refresh");

对此

$("#linksList").listview().listview("refresh");

然后返回新的错误

未捕获的类型错误:无法读取未定义的属性“jQuery171004728581593371928”

更多错误详情:

未捕获的类型错误:无法读取未定义的 jquery.mobile-1.1.0.min.js:107 的属性“jQuery171004728581593371928”

a.widget._createSubPages jquery.mobile-1.1.0.min.js:107

a.widget.refresh jquery.mobile-1.1.0.min.js:103

a.widget._create jquery.mobile-1.1.0.min.js:100

a.Widget._createWidget jquery.mobile-1.1.0.min.js:14

a.widget._createWidget jquery.mobile-1.1.0.min.js:17

a.(匿名函数).(匿名函数) jquery.mobile-1.1.0.min.js:12

(匿名函数)jquery.mobile-1.1.0.min.js:14

e.extend.each jquery-1.7.1.min.js:2

e.fn.e.each jquery-1.7.1.min.js:2

a.fn.(匿名函数)jquery.mobile-1.1.0.min.js:13

(匿名函数)main.js:45

n jquery-1.7.1.min.js:2

o.fireWith jquery-1.7.1.min.js:2

w jquery-1.7.1.min.js:4

d jquery-1.7.1.min.js:4

我的 rss 阅读器的 JS FIDDLE http://jsfiddle.net/6Ycdm/

最后，当您单击 RSS 提要中的链接时，会填充此页面，只是额外的详细信息等。

<div data-role="page" id="contentPage">
    <div data-role="header" id="header" style="color: white;"><img alt=
    "thread" border="0" id="thread" src="./img/logo2.png" style=
    "width: 220px;"></div>

    <div data-role="content">
        <p id="entryText"></p>
    </div>

    <div>
        <a class="ui-btn-active" data-icon="false" data-rel="back"
        data-role="button" style=
        "background: rgb(24,120,143); color: white;">back</a> 
    </div>

    <div data-position="fixed" data-role="footer" data-theme="a" id=
    "footer">
        <h3>Copyright &copy; 2013 </h3>
    </div><!-- /footer -->
</div> 

我想关于 webapp 的更多细节很少，任何答案都应该能够在手机上运行(使用 phonegap 构建)我不认为这是一个问题，因为我当前的 RSS 提要阅读器工作正常。真的只是寻找一种复制它的方法。我在应用程序上使用了 mutltipage 方法，但我不介意添加另一个 html 页面并将其链接进来，尽管我已经尝试过但无济于事!我遇到了同样的错误。

我不知道在您离开事件页面并转到比方说“新闻”页面后我是否必须关闭 ListView ？也不知道该怎么做。我猜只是一个可能的解决方案的想法？

感谢您的帮助，我会尽快回复发布的任何答案!

Answer 1

1. 首先，不要将 document ready 与 jQuery Mobile 一起使用，这是一种不好的做法。阅读 here 为什么。

2. 据我所知，在您的代码中您使用的是实时方法。 Live 已被弃用，虽然它现在可以工作，但当您切换到任何大于 1.8.3 的 jQuery 版本时，它将无法工作。只需将其替换为方法即可。

3. 即使没有对方法 ListView 进行二次初始化，您的代码也应该可以正常工作。我认为您真正的问题是您使用的是 2 个具有相同 ID 的 ListView 。当它们都加载到 DOM 中时，jQuery 将始终访问第一个 ListView 。并且因为它已经成功填充，所以会抛出此错误。

   有两种方法可以访问正确的 ListView 。

   使用此语法找到正确的 ListView :

   $('#PAGE_ID').find('#linksList").listview("refresh");
   

   其中 PAGE_ID 是您当前页面的 ID，或者如果您使用 pageshow 或 pagebeforeshow 事件来填充您的 ListView ，请使用以下语法:

   $.mobile.activePage.find('#linksList").listview("refresh");
   

   此解决方案仅适用于 pageshow 或 pagebeforeshow 事件(pageinit 也应该适用于它)。