Knockout.js,jQuery移动冲突{Node not found} - bug? [英] Knockout.js, jQuery mobile conflict {Node was not found} - bug?

查看:95
本文介绍了Knockout.js,jQuery移动冲突{Node not found} - bug?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用jQuery mobile和Knockout.js来测试 http:// knockoutjs上的第一个例子.com / documentation / foreach-binding.html 但没有显示任何内容,FireFox的错误控制台显示此错误:

I am using jQuery mobile and Knockout.js to test the first example on http://knockoutjs.com/documentation/foreach-binding.html but nothing is displayed and error console of FireFox reveals this error:

时间戳:9/10/2012 1 :13:16 PM
错误:NotFoundError:未找到节点
源文件:http:///kotest/Scripts/knockout-2.1.0.js
行:46

Timestamp: 9/10/2012 1:13:16 PM Error: NotFoundError: Node was not found Source File: http:///kotest/Scripts/knockout-2.1.0.js Line: 46

请注意,这是今天下载的最新淘汰赛2.1.0.js.

Note that this is the latest knockout-2.1.0.js downloaded today.

代码如下:

    <!DOCTYPE html>
    <html>
    <head>
    <title></title>
     <link href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css" rel="stylesheet" type="text/css" />

     <script src="http://code.jquery.com/jquery-1.7.1.min.js" type="text/javascript"></script>
     <script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js" type="text/javascript"></script>

     <script src="Scripts/knockout-2.1.0.js" type="text/javascript"></script>
    </head>
    <body>
  <h4>People</h4>

    <table>
        <thead>
            <tr><th>First name</th><th>Last name</th></tr>
        </thead>
        <tbody data-bind="foreach: people">
           <tr>
                <td data-bind="text: firstName"></td>
                <td data-bind="text: lastName"></td>
            </tr>
        </tbody>
    </table>

    <script type="text/javascript">
      ko.applyBindings({
        people: [
                { firstName: 'Bert', lastName: 'Bertington' },
                { firstName: 'Charles', lastName: 'Charlesforth' },
                { firstName: 'Denise', lastName: 'Dentiste' }
            ]
      });
    </script>
    </body>
    </html>

我应该提一下,如果删除了对jQuery mobile js文件的引用,它会按预期工作。

I should mention that it works as expected if references to the jQuery mobile js files are deleted.

推荐答案

更新:
您可以尝试jQuery移动pageinit功能。

Update: You can try the jQuery mobile pageinit function.

<script type="text/javascript" >
    $(document).on('pageinit','[data-role=page]', function(){
      ko.applyBindings({
        people: [
                { firstName: 'Bert', lastName: 'Bertington' },
                { firstName: 'Charles', lastName: 'Charlesforth' },
                { firstName: 'Denise', lastName: 'Dentiste' }
            ]
      });

    });    
    </script>

包含一个div标签,其中包含来自jquery mobile的data-role =page绑定:

include a div Tag with the data-role="page" binding from jquery mobile:

<div data-role="page" >
    <table>
        <thead>
            <tr><th>First name</th><th>Last name</th></tr>
        </thead>
        <tbody data-bind="foreach: people">
           <tr>
                <td data-bind="text: firstName"></td>
                <td data-bind="text: lastName"></td>
            </tr>
        </tbody>
    </table>
</div>

这篇关于Knockout.js,jQuery移动冲突{Node not found} - bug?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆