HTML jquery onclick事件不能在Android手机上动态创建的链接上工作

HTML jquery onclick event not working on dynamically-created links on Android phones only

本文关键字:动态 创建 工作 链接 手机 Android onclick jquery 事件 不能 HTML      更新时间:2023-09-26

我遇到了一个问题,动态创建的链接在我测试过的所有设备上(在所有桌面浏览器上,在我的iPhone上,在我的iPad上,在我的三星Galaxy平板电脑Chrome浏览器上)都有效,但在Android手机上点击时不起作用(我已经在运行Chrome的三款Android手机上进行了测试,抱歉没有Chrome版本,但一部手机真的是新的,其他的最多是1-2年)。

我正在动态创建链接,以便在循环中将项目添加到购物车中(在更大的动态创建的实体中)。

所讨论的链接基本上是这样构造的:

var itemHTML = "";
...
itemHtml += '<a href="'+gAddLink+'" class="add2Cartlink">...</a><span>'n'
...

gAddLink只是一个标准的URL。然后,我使用document.write()将该itemHTML(以及其他HTML)动态地插入到页面中。

由于这是在页面加载时动态创建的(原因超出了这个问题的范围,但这是必要的),我知道我必须有一个点击处理程序设置如下:

$('.elementToInsertTo').on('click', '.add2CartLink', function() { ... });

"。elementToInsertTo'是父元素,它不是动态创建的,在页面加载时出现在页面上。有多个这样的父元素,因此我不能使用元素ID。但我不认为这有什么区别。

再一次,我可以确认这个点击监听器中的函数调用在除了Android手机之外的任何地方都可以工作(据我所知)。知道这是为什么吗?我一整天都在阅读StackOverflow页面,但似乎没有任何与此相关的内容。我读过一堆关于JS闭包(这可能仍然是问题)和类似的,但似乎没有一个是相关的,因为链接点击监听器是在我测试过的大多数设备上工作(甚至Android平板电脑的Chrome浏览器,这是真正让我困惑的部分)。

如果你碰巧以前见过这个问题,或者知道为什么会发生这种情况,请在阅读下一部分之前把它写出来,以免混淆或偏见。

好的,现在到更令人难以置信的部分,尽管我希望这只是帮助弄清楚这个问题,不要混淆情况。我用USB将其中一部手机连接到我的电脑上,并使用Chrome开发工具进行了一些远程调试,如下所述(https://developers.google.com/chrome-developer-tools/docs/remote-debugging)。我可以确认点击监听器没有工作(它们没有被触发)…直到我对链接做了一些元素检查(即,当我在浏览器中检查dom元素时,链接在我的手机上高亮显示,再次使用Chrome开发工具),然后点击链接。这使得点击侦听器能够工作!什么? ?为了进一步调试,如果检查页面上的任何DOM元素并单击链接,则单击侦听器会正常工作。如果我从开发工具选项卡中更改选项卡,或者只是停止检查Chrome开发工具中的DOM元素,则链接单击侦听器将不再工作。我真的不知道这是怎么回事,但我希望这部分信息能缩小安卓手机和点击监听器可能发生的情况。

很高兴尝试提供任何其他信息,我可以,虽然我没有Android手机测试的时刻。

谢谢!

Tap仍然是需要的(感谢两个建议),但问题是与第三方JS库stoppropagation()调用。显然,这只发生在安卓手机上,但不管怎样,在去掉线路后,点击(在电脑上)和点击(在手机上)现在无处不在。谢谢!