Javascript jquery mobile和jquery ui不兼容_Javascript_Jquery_Html

Javascript jquery mobile和jquery ui不兼容

javascript jquery html

Javascript jquery mobile和jquery ui不兼容,javascript,jquery,html,Javascript,Jquery,Html,我正在开发一个html5应用程序，它可以在桌面和，平板电脑和移动设备。在使用进度条和对话框时，我陷入了困境。起初我一直在使用jquery mobile，但直到现在，我才意识到，为了使用进度条和对话框弹出窗口，我才想结合使用jquery ui。这是两个插件效果的示例代码 <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>dialogbox demo&

我正在开发一个html5应用程序，它可以在桌面和，平板电脑和移动设备。在使用进度条和对话框时，我陷入了困境。起初我一直在使用jquery mobile，但直到现在，我才意识到，为了使用进度条和对话框弹出窗口，我才想结合使用jquery ui。这是两个插件效果的示例代码

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>dialogbox demo</title>
    <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>        
<script>
    $(document).ready(function () {
        $().lowStorageSpace();
    });

        $.fn.lowStorageSpace = function () {
            $('<div></div>').appendTo('body')
          .html('<div><h5>You are running out of space.backup or sync data before you proceed!!</h5></div>')
          .dialog({
              modal: true, title: 'Low storage space!!', zIndex: 10000, autoOpen: true,
              width: 'auto', resizable: true,
              buttons: {
                  Sync: function () {
                      //sync();
                      $(this).dialog("close");
                  },
                  Backup: function () {
                      // backup();
                      $(this).dialog("close");
                  },
                  Cancel: function () {
                      //cancel();
                      $(this).dialog("close");
                  }
              },
              close: function (event, ui) {
                  $(this).remove();
              }
          });

        }

</script>
</body>
</html>


对话框演示
$（文档）.ready（函数（）{
$（）.lowStorageSpace（）；
});
$.fn.lowStorageSpace=函数（）{
$（''）.appendTo（'正文'）
.html（'您的空间不足。请在继续之前备份或同步数据！！'）
.对话({
模态：真，标题：“低存储空间！！”，zIndex:10000，自动打开：真，
宽度：“自动”，可调整大小：真，
按钮：{
同步：函数（）{
//sync（）；
$（此）.dialog（“关闭”）；
},
备份：函数（）{
//备份（）；
$（此）.dialog（“关闭”）；
},
取消：函数（）{
//取消（）；
$（此）.dialog（“关闭”）；
}
},
关闭：功能（事件、用户界面）{
$（this.remove（）；
}
});
}

当我注释jquery.mobile-1.2.0.min.js时，上面的代码运行良好。但我真的需要它在我的整个应用程序。任何关于我如何使用这两个的帮助都将不胜感激。我看到过很多类似的问题，但都解决了我的问题

提前谢谢。

我同意这是一种冲突。在jQueryUI和jQueryMobile的所有示例中，我看到的代码都没有显示这两个可以在同一个脚本上使用。我会使用两个不同的脚本，一个用于ui，一个用于mobile。这样，这里就不应该有任何冲突

@John…在我的情况下，使用不同的脚本不会起作用，因为我在一个html页面上工作，其中包含多个页面。