当我使用jQuery进行简单的点击事件时,它只适用于链接.有没有办法让它适用于跨度等:
$("span.clicked").live("click", function(e){alert("span clicked!")});
$("a.clicked").live("click", function(e){alert("link clicked!")});
SPAN适用于Safari但不适用于Mobile Safari(在iPhone或iPad上),而A标签适用于两者.
当使用像Swiftkey这样的第三方键盘时,像keypress这样的javascript事件不会注册.例如,Google地图自动填充功能无法使用https://developers.google.com/maps/documentation/javascript/examples/places-autocomplete
看起来像是一个iOS错误,但有关如何解决这个问题的任何想法？
我通常使用表单绑定点击处理程序,
$(document).on('click', 'element', function() { ... });
避免以后加载元素的问题.这在桌面浏览器(以及Chrome模拟iPhone)上运行正常,但在实际的iPhone上这不起作用(我试过像' ' 这样的解决方案cursor: pointer;)
我注意到另一个按钮正在工作,使用标准的点击处理程序.我改变了我的新按钮
$('element').click(function() { ... });
它开始工作了.为什么应用单击处理程序的这两种方法在iOS上的运行方式不同？
我有一组运行 iOS 9.3.5 的 iPad（第 3 代）。这是他们支持的最高水平。我正在尝试用等效的 Web 应用程序替换自定义 iOS 应用程序的功能。该站点是用 Angular 11 构建的，目标是es2015，并且我已经在浏览器支持文件中声明了 iOS > 9。该网站的大部分内容与我对此类旧设备的预期完全相同。整个事情的关键是这个需要填写的第三方表单，它作为 iframe 提供，它的表现如此，非常糟糕。
这是带有 iframe 的组件 HTML 代码（出于隐私原因更改了 URL）：
<div class="row header"><a class="restart" (click)='restart()'>Start Over</a><a routerLink='/welcome'><i class="fa fa-times close-x"></i></a></div>
<iframe src="https://notarealsite.com" (load)="waiverLoaded()"></iframe>
该waiverLoaded函数是一个简单的布尔翻转，用于检测嵌入页面在完成后重新加载，以便我可以路由到我的应用程序中的不同组件。如果 iframe 是页面上的唯一元素，则性能不变。嵌入时运行良好的其他页面不会像弃权那样遭受性能下降，因此我必须假设它是弃权页面的代码中的某些内容。
原始的自定义 iOS 应用程序使用 webviewer 加载页面，加载时间为 2 秒或更短。直接在 Safari 中访问页面可以看到相同的性能。在这两种情况下，考虑到设备的使用年限，动态形式的响应能力是合理的。当通过 iframe 加载页面时，性能坦克。我们正在谈论 30-45 秒的加载，有时在点击按钮或字段和表单反应之间长达一整秒的延迟。
我已将设备连接到我的计算机并使用 MacOS Safari 中的远程检查器查看时间线。大部分初始加载时间是表单使用的几个 1-2 kb 图像文件，如滚动条和一些图标。通常这些项目之一最终需要 20-25 秒。当与表单交互时，时间线中会出现一个 XML 资源，每次字段更改或按钮按下时都会出现，这需要大约一两秒钟才能使页面再次更新。
我不太精通像这样的 Web 应用程序性能故障排除，这是我构建的第一个真正的 Angular 应用程序，所以我可能会遗漏一些非常明显的东西。是什么导致直接访问的页面与放置在 iframe 中的页面之间的性能差异？
一些额外的信息：
npm serve …我在这里错过了什么？
请注意:使用jQuery MOBILE
如果我使用preventDefault页面加载就好像我只有链接而没有脚本,当我改为返回false(我总是习惯在普通的JS onclick事件处理程序上使用)时,它按预期工作.我已经查看了其他帖子,并且都使用了.click,并建议使用preventDefault.
$(document).ready(function() {
$("#leftdiv a").on("click",function(e) {
$("#rightDiv").load(this.href);
return false; // I was sure preventDefault would work
});
});
HTML
<div id="leftdiv" style="position:absolute;padding-right:5%; overflow:scroll;">
<a href="page1.htm">Launch page 1</a><br />
<a href="page2.htm">Launch page 2</a>
</div>
<div id="rightDiv" style="padding-left:30%"></div>
在我的网络应用程序中,有一个单独的移动设备导航栏.当单击菜单按钮或单击站点中的任何其他位置时,我希望此导航栏折叠.它已经适用于任何移动浏览器,但不适用于Safari移动设备(在Safari中也适用于主页,但不适用于其他页面).在其他页面中,有一些动态生成的html.似乎click事件对这些内容不起作用.我真的很感激这个问题的解决方案.代码如下.我试过'body',$(document),window而不是$('html').它也不适合他们.
$('html').click(function(event) {
var clickover = $(event.target);
var $navbar = $(".navbar-collapse");
var _opened = $navbar.hasClass("in");
if (_opened === true && !clickover.hasClass("navbar-toggle")) {
$navbar.collapse('hide');
}
});
我也尝试过修复iPad的jQuery Click事件中提到的内容.但是那里提到的代码根本没有触发.我为此尝试过的代码如下.
var ua = navigator.userAgent,
event = (ua.match(/iPad/i)) ? "touchstart" : "click";
$('body').bind(event, function(e) {
var clickover = $(event.target);
var $navbar = $(".navbar-collapse");
var _opened = $navbar.hasClass("in");
if (_opened === true && !clickover.hasClass("navbar-toggle")) {
$navbar.collapse('hide');
}
}
我真的很感激我的问题的答案(我正在研究这一天超过一天,但没有找到解决方案).