javascript - 优化。当用户提交表单时,加载对话框不会立即出现

标签 javascript jquery optimization event-handling

我正在开发一个 Web 应用程序,该应用程序允许用户查看以 SVG 格式显示的大型(代谢)网络并与之交互。可以在这里查看link

我有相当大量的 jQuery 代码来处理不同的事件。特别是当用户提交表单时,会执行提交函数。我在该函数中做的第一件事是显示模式对话框,该对话框会阻止 UI 并告诉用户页面正在加载。

 $('#indexForm').submit(function() {
    dialog.dialog('open');
  ...

之后,该函数操作网页上的元素,通过 AJAX 加载大型网络 XML 并将其附加到页面。所有操作完成后,对话框消失,用户可以再次开始与页面交互。

我的问题在于单击提交按钮到显示对话框之间存在的延迟。用户按下提交后,UI 会卡住相当长的一段时间。

我怀疑浏览器被页面上的元素数量淹没(SVG map 有很多元素 ~3mb),因此它无法对表单提交等事件立即使用react。期待任何解释和建议来改进我的代码并解决此问题。

最佳答案

尝试添加您的对话框以在单击事件中打开,而不是在提交中打开:

$("#indexForm").click(function(){
       dialog.dialog('open');
});

看看这是否对性能有帮助

关于javascript - 优化。当用户提交表单时,加载对话框不会立即出现,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7519387/

相关文章:

javascript - 数组形状错误

JavaScript 错误 : Unable to get property of 'click' of undefined or null reference

用于在 Chrome 上不起作用的圆 Angular 图像的 Javascript

javascript - 使用 jQuery 执行此简单过滤器的更好方法是什么

mysql - 如何优化 1Gb 大小 250k+ 行的 Mysql 表以获得更好的性能

javascript - AJAX 页面更新后重新初始化 jQuery 插件

javascript - jquery 为 i18n 扩展

javascript - 使用 Javascript 在逗号之间插入 CSS

python - 循环速度优化

sql-server - 使用巨大的 IN 语句帮助优化此查询