4

尽管我有很多人提到了类似的兼容性问题，但他们 50% 的问题在 StackOverflow 上得到了解决。我希望我的问题能达到 51-49 :)

考虑这段代码：

<html>
<head>
  <title>Hello, world!</title>
  <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
  <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
  <script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>
</head>
<body>
  Hello
</body>
</html>

如果你在网页上加载它，你会在浏览器中间看到一个灰色的圆圈，并且不会显示“你好”这个词。在 Web 控制台上，您将看到以下内容：Uncaught TypeError: Object 0 has no method 'match' (Chrome) 或TypeError: c.match is not a function (Firefox) 或SCRIPT438: Object doesn't support property or method “匹配”（IE）。

想在一个页面上同时使用 jquery-ui 和 jquery-mobile 是一个坏主意，还是我做错了什么？

4

1 回答 1

9

唯一相关的是订单，在 jUI 之后加载 jQM，css 文件也是如此：

<!DOCTYPE html>
<html>
<head>
  <title>jQM Complex Demo</title>
  <meta name="viewport" content="width=device-width"/>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" />    
  <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
  <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
  <script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>    
  <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
</head>
<body>
    <div data-role="page" id="index">    
      Hello
    </div>
</body>
</html>

你还需要：

<!DOCTYPE html>

这将防止 ajax 加载程序舞会显示：

<div data-role="page" id="index">    
    Hello
</div>
于 2013-01-29T08:34:33.400 回答