我正在开发一个 html5 应用程序，它可以在桌面、平板电脑和移动设备上运行。在使用进度条和对话框时卡住了。起初我一直在使用 jquery mobile，但直到现在我才想合并 jquery用户界面为了使用进度条和对话框弹出窗口是当我意识到两者一起使用时效果不佳。这是两个插件效果的示例代码
<!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>
当我注释掉 jquery.mobile-1.2.0.min.js 时，上面的代码运行良好。但我在完整的应用程序中也确实需要它。任何有关我如何使用这两者的帮助将不胜感激。我已经看到了很多类似的问题，但没有解决我的问题提前谢谢。