繁体   English   中英

JqueryMobile淘汰和未捕获的错误:NOT_FOUND_ERR:DOM异常8

[英]JqueryMobile Knockout and Uncaught Error: NOT_FOUND_ERR: DOM Exception 8

我正在尝试使用敲除和jquerymobile,无法使其正常工作。 这是我的代码:

<!DOCTYPE html>     
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <script src="/nw/scripts/jquery-1.8.2.js"></script>
    <script src="/nw/scripts/knockout-2.1.0.debug.js"></script>
    <script src="/nw/scripts/jquery.mobile-1.2.0.js"></script>
    <link rel="stylesheet" href="/nw/scripts/jquery.mobile-1.2.0.css" />
        <title>title</title>
</head>
    <body>
        <div>
<script type="text/javascript">
    function AppViewModel() {
        this.test = [{ "name": "noam", "age": "36" }, { "name": "yael", "age": "34"}];
    }
    $(document).ready(function () { 
        ko.applyBindings(AppViewModel());
        });
</script>
<ul data-bind="foreach: test" id="myList">
    <li>test <span data-bind="text: name"></span></li>
</ul>
        </div>
    </body>
</html>

运行此命令时,出现以下错误:未捕获的错误:NOT_FOUND_ERR:DOM异常8

当我注释掉jquerymobile脚本时,它可以工作。

任何帮助都将被申请

造成此问题的直接原因是在<script>块中放置了ko.applyBindings位置。 如果将<script>块移到<head>标记中,则示例按原样工作,如下所示:(还请注意pageinit事件和data-role="page"属性的使用)

<!DOCTYPE html>     
<html>
<head>
  <meta name="viewport" content="width=device-width" />
  <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
  <script src="http://cloud.github.com/downloads/SteveSanderson/knockout/knockout-2.1.0.debug.js"></script>
  <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
  <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
  <title>title</title>
  <script type="text/javascript">
    function AppViewModel() {
      this.test = [{ "name": "noam", "age": "36" }, { "name": "yael", "age": "34"}];
    }
    $(document).bind('pageinit', function () {
      ko.applyBindings(AppViewModel());
    });
  </script>
</head>
  <body>
    <div data-role="page">
      <ul data-bind="foreach: test" id="myList">
        <li>test <span data-bind="text: name"></span></li>
      </ul>
    </div>
  </body>
</html>

请记住,jQuery移动版和敲​​除版均会更改DOM,而DOM错误是两者之间冲突的征兆,其中一个库移动了DOM元素,而另一个库随后尝试解决该元素。

为了使JQM和淘汰赛能够一起工作(他们这样做),您需要非常熟悉JQM何时/如何对DOM进行更改。 此页面可能是一个很好的起点。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM