个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
我无法创建一个工作示例，但代码很简单。
配置
IDE:Visual Studio 2017
目标平台:Windows x64
系统: Win 10
我的项目: Javascript//Blank App (Apache Cordova)//ver. 6.3.1
HTML//index.html
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<header></header>
<main>
<div id="cal">
</div>
</main>
<footer>
<!-- ## this creates a simple pure css loader ## -->
<div class="progress">
<div class="indeterminate"></div>
</div>
<a href="#" class=".addItem">Add</a>
</footer>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="scripts/platformOverrides.js"></script>
<script src="frameworks/jquery-3.2.1.min.js"></script>
<script src="frameworks/materialize/js/materialize.min.js"></script>
<script type="text/javascript" src="scripts/index.js"></script>
</body>
</html>
Javascript//index.js
(function () {
"use strict";
document.addEventListener( 'deviceready', onDeviceReady.bind( this ), false );
function onDeviceReady() {
$(document).ready(function () {
$('.addItem').on('click', function () {
setTimeout(function () {
loadCalendar();
}, 5000);
});
});
};
function loadCalendar() {
var i=0;
while (i <= 10000) {
var html = '<div class="row"></div>';
$('#cal').append(html);
i++;
}
}
} )();
应用程序启动并且 UI 按预期工作，progress 加载器显示他的 css 动画。单击按钮 addItem 后，所有工作持续 5 秒，然后 UI 卡住，直到 while 循环 结束。我觉得不正常，怎么解决？
谢谢
一个重要的澄清
我不希望 DOM 在循环过程中被更新，上面这段代码不是真正的代码，它只是用于理解和测试。真正的循环要短得多、快得多，但它仍然是一个问题。
发生的事情是整个界面卡住，整个应用程序。 CSS动画应该完全独立于Javascript，但是卡住了!
Here an example of what I expected
我希望这能更好地阐明这一点。
最佳答案
如评论中所述，所有循环声明都是阻塞程序，并且在循环完成之前 - 即使是最微不足道的悬停效果也将无法响应。
JavaScript 是线性的、同步的和单线程的进程。要避免卡住情况，您需要将循环操作移至单独的线程。
例如:在另一个文档的单独实例上!
关于javascript - Cordova 在长时间的 Javascript 期间卡住 UI，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46865180/
25
4
0
我使用plugman命令在cordova中创建了一个插件 它创建了所有必需的文件。然后我在插件中添加了android平台。 然后我尝试将它添加到 cordova 应用程序中。我成功添加了它，但是当我尝
我使用plugman命令在cordova中创建了一个插件 它创建了所有必需的文件。然后我在插件中添加了android平台。 然后我尝试将它添加到 cordova 应用程序中。我成功添加了它，但是当我尝
我正在尝试在较旧的 Atrix 上安装一个应用程序，在 S3 上运行良好。搜索论坛可能的问题是SDK版本较高(Atrix是4.0.4)。修复显然是在设置 API 级别。 但是当我运行 cordova
使用 cordova build在一个为期一年的项目中提出: :processDebugResources my_project/platforms/android/build/intermediat
我有一个可以创建文件的可运行应用程序。 我正在寻找一种工作后数小时从cordova应用程序中删除文件的方法。我似乎无法使其正常工作。 这是用于创建和删除文件的代码: function crea
有什么区别吗Cordova 构建 Android 和 Cordova 准备 Android 命令？ Reference is added here 最佳答案 准备将您的 www Assets 和任何插
我检查了文档，但没有找到关于此命令的明确说明。 那么，有谁知道cordova prepare命令的作用是什么？ 是否更新特定于平台的www文件夹？ 如果是，它将复制根www的全部内容吗？ 它会更新平台
我们正在开发正在使用Cordova(专用于Ionic)的移动应用程序，并且正在使用PhoneGap PushPlugin和Amazon SNS进行推送通知。反过来，这会撞到我们与Amazon SNS进
我正在使用Vue，Webpack和Cordova。 Videos 如果我在没有Cordova的情况下加载页面，并且在Firefox浏览器中，则可以使用Youtube视频上的全屏图
因此，我尝试在我的(正在运行的)Ionic应用程序中安装一个新插件，该文件名为https://ionicframework.com/docs/native/firebase-dynamic-links
我像这样安装了cordova: C:\Windows\system32>npm install -g cordova 我明白了: C:\Users\cyril\AppData\Roaming\npm\
我有一个 cordova 应用程序，我使用以下代码捕获了后退按钮: document.addEventListener("backbutton", function (e) { bac
如何在 Cordova 中的蓝牙设备和 Android/iOS 之间发送和接收一系列数据字节？ 我的项目的详细信息: 我正在开发一个蓝牙传感器设备。设备以一系列字节的形式发送数据。它还对设备 API
我是 cordova 开发的新手。我使用 Onsen UI (1.2.1) 作为布局框架。ons-toolbar 上的标题有问题。 someTextHere 如果我在 ripple 上运行
我有一个启用了平台浏览器的 Cordova 应用程序。我想在 Chrome 中使用摄像头，但调用摄像头根本没有任何反馈。它在我的 Android 设备上就像一个魅力。 我通过这个命令启动:cordov
我对thid docs https://firebase.google.com/docs/android/setup#available_libraries中提到的根级和应用程序级的路径目录感到困惑
喜欢这些插件 https://github.com/ArchieGoodwin/SilentShot https://github.com/alongubkin/phonertc 他们没有 tarba
我有一个 Angular 2 应用程序，我正在将其构建到 cordova 中并部署到 Android/IOS。我没有使用 ionic，我见过许多使用 ionic 的解决方案，但我现在无法将整个项目转换
当我发出命令时，在带有 Cordova 的 Ionic 3 中: ionic cordova run android --emulate 它给出以下消息: BUILD FAILED in 3s
我无法在 ionic 5.2.4v 中安装软件包 cordova-res 并收到以下错误。 命令:cordova-res C:\hanu\cordova-res-master\cordova-res
我是一名优秀的程序员,十分优秀！