jQuery Mobile Popup 和 ListView，以及 Popup div 内的 Knockout.js 数据绑定 - 不工作

Posted 2023-05-09

【中文标题】jQuery Mobile Popup 和 ListView，以及 Popup div 内的 Knockout.js 数据绑定 - 不工作

【英文标题】：jQuery Mobile Popup and ListView, and Knockout.js Data Binding Inside the Popup div - Not Working

【发布时间】：2012-10-22 11:23:41

【问题描述】：

我正在使用 jQuery Mobile 和 knockout.js 开发一个移动网站。我有一个（某种）复杂的场景，jQuery Mobile 的弹出窗口和列表视图以及弹出 div 内的剔除数据绑定，我无法让它工作。

我有一个嵌套的警报列表，如下所示。对于每一天，它都会创建一个列表分隔行。然后在每一天里面，每个闹钟都有一行。

<ul id="alarmslist" data-bind="foreach: days" data-role="listview">
    <li data-role="list-divider"><span data-bind="text: date"></span></li>
    <!-- ko foreach: alarms1 -->
    <li>
        <a href="#popupBasic" data-rel="popup"><span data-bind="text: alarmName"></span></a>
        <section id="popupBasic" data-role="popup" data-corners="true" data-history="false" data-overlay-theme="a">
            <a href="#" class="ui-btn-right" data-icon="delete" data-iconpos="notext" data-rel="back" data-role="button" data-theme="c">Close</a>
            <ul data-role="listview" data-inset="true">
                <li data-role="divider" data-theme="a">Alarm Options</li>
                <li><section class="alarmDetail"><span data-bind="text: alarmID"></span></section></li>
                <li><a href="#">Go to Data</a></li>
                <li><a href="#">Acknowledge</a></li>
            </ul>
        </section>
    </li>
    <!-- /ko -->
</ul>

我需要将弹出窗口小部件附加到警报行，这样当单击 li 行时，弹出窗口会显示该行的选项列表。这应该适用于每一行。每行的选项将取决于 alarmID 键。

这就是问题发生的地方。我正在尝试对alarmID 字段（它是alarms1 数组的一部分）进行数据绑定，以便下一个操作知道如何处理正确的警报。但是，我得到一个敲除错误，因为它找不到alarmID()。我猜 jQuery Mobile 正在 DOM 底部创建弹出部分，远低于我的视图和视图模型为淘汰赛定义的位置。

无论如何，有人知道如何“解决”这种情况吗？或者，知道解决方法吗？或者，甚至是其他一些解决方案？

【问题讨论】：

你也可以发布你的 javascript 或者为你的问题制作一个有效的 jsfiddle.net 吗？这里没有足够的信息来真正给你答案。

【参考方案1】：

我还在 Knockout.js Google 小组上发布了这个问题，并收到了帮助我的答案。它位于https://groups.google.com/forum/?fromgroups=#!topic/knockoutjs/xQYZrxQ6Jsg。谢谢。