点击事件在iPad / iPhone / Android上的动态生成元素上不起作用

Question

这就是我构建DOM的方式：

var projectOverlay = document.createElement("div");
projectOverlay.className = "projectOverlay";
projectOverlay.onclick = function(){openSlider($(this))};   
project.appendChild(projectOverlay);

所以... openslider(elem)函数在所有浏览器中都可以正常工作，除了移动设备（Android手机，iPhone，iPad等）上。 还有什么其他方法可以将事件绑定到尚未创建的元素，或者我在这里做错了什么？

实时示例 -单击联系人以获取项目，然后尝试单击其中一个项目以将其展开。 单击关于将使您返回首页。 仍然很混乱，但是该网站仍处于早期开发阶段。

Answer 1

某些电话和浏览器未在JavaScript中实现“ onclick”事件。 您应该处理更多的触摸友好事件，例如“ touchstart”，“ touchmove”和“ touchend”。

此处提供更多信息： https : //developer.mozilla.org/zh-CN/docs/DOM/Touch_events

Answer 2

在我的项目中遇到了同样的问题。 除了在iOS6上以外，动态创建的元素没有获取click事件（因此可能已在此处修复了某些问题）。 我发现的解决方法是对包含动态创建的元素的div强制进行转换。 当页面加载时，包含我动态创建的元素的div确实存在。 假设它有一个id属性，值为“ container”，代码如下

var container = document.getElementById("container");
container.style.webkitTransitionDuration = "0";
container.style.webkitTransform = "translateY(0px)";

然后，在容器下动态创建的元素将获得点击事件。

Answer 3

尝试在appendChild之后移动click事件绑定