-2

我正在开发一个 iPhone 混合应用程序。我已经使用 Javascript 插入了一个链接，并定义了应该在onclick事件中调用的函数。

当我单击链接函数并执行所需的操作时，如果我单击应用程序主体中的任何位置，则会再次调用相同的函数。

我的应用程序中存在的两个链接都发生了这种情况。

谁能告诉发生了什么错误？

我编写了一个函数来添加图像作为链接。代码如下：

// create a link for delete enquiry
var DelLink = document.createElement("a");

// setting the name of the link.
DelLink.setAttribute("name" , "DelButton"+pCurrentEnquiryID);

// image for the delete and its properties.
var DelImage = document.createElement("img");
DelImage.setAttribute("src","images/delete.png");
DelImage.setAttribute("height","30px");
DelImage.setAttribute("width","30px");

// append image to the link
DelLink.appendChild(DelImage);

//specifying onclick event of the link
DelLink.setAttribute("onclick","DeleteEnquiry(this)");
//DelLink.onclick = "DeleteEnquiry(this)";

return DelLink;
4

1 回答 1

2

好的，所以你正在设置onclick属性。现在，这在“传统”平台上运行良好（具有类似鼠标的设备，带有可用于单击对象的按钮）。触摸设备（名字里有线索）没有这个，而是通过触摸屏幕来操作的。好吧，你知道了，所以我认为你可以理解touch事件非常过载（多点触控）。

触摸屏幕一秒钟意味着与触摸屏幕一秒钟完全不同的事情。您也可以用 1、2、3 或 4 根手指触摸屏幕。每次都要以不同的方式处理。
为了使事情变得更加复杂，您可以在屏幕上拖动或滑动，这也需要以不同的方式处理。

幸运的是，我最近编写了一些代码来将某些触摸事件映射到单击处理程序，使用闭包、绑定侦听器和设置超时。因此，这可能会对您有所帮助：

if ('ontouchstart' in window)
{//we have a touch device
    document.body.addEventListener('touchstart',function(e)
    {//handle all touch events on the body
        e = e || window.event;
        //not sure about all mobile browsers (win mobile)
        //so I'm playing it safe
        var target = e.target || e.srcElement;
        if (target.tagName.toLowerCase() !== 'a')
        {//didn't touch on a link
            return e;//stop
        }
        //touch must end after .3 seconds, otherwise user is zooming or something
        var timer = setTimeout(function()
        {
            target.removeEventListener('touchend',endHandler,false);//unbind after .3 seconds
            clearTimeout(timer);
        },300);
        var endHandler = function(e)
        {
            e = e || window.event;
            var endTarget = e.target || e.srcElement;//get element on which the touch ended
            clearTimeout(timer);//stop timer
            target.removeEventListener('touchend',endHandler,false);//remove listener
            if (endTarget !== target)
            {//user "swiped"
                return e;
            }
            //touch ended within .3 seconds, and ended on the same element, interpret this as click
            return clickHandlerFunction.apply(target,[e]);//invoke click handler with the target as context
        };
        target.addEventListener('touchend',endHandler,false);//bind touchend listener
    },false);
}

基本上，它的作用是注册所有touchstart 事件。首先要检查的是用户是否触摸了感兴趣的元素，我想用我的自定义事件处理程序来处理它。如果不是，则返回事件，没有任何变化。如果对元素 touches 感兴趣，我会为该目标上的事件
创建一个侦听器。touchend我还设置了一个超时，它将在 0.3 秒后删除该侦听器（以防止泄漏）。如果touchend事件触发，检查用户是否在原始元素上被释放，如果没有，将其解释为滑动，然后停止。
如果目标匹配，则在目标的上下文中调用单击处理程序并传递事件对象！所以你可以调用stopPropagation()和/或preventDefault()方法。也通过touchhandler清除计时器开始并自行删除（再次：防止内存泄漏）。
与以往一样，这是一个非常非常基本的片段，可以做更多的工作

触摸事件包含更多信息（例如，您可以检查有多少手指正在触摸屏幕）。我也省略了一些我的原始代码，因为那会使它变得非常复杂和混乱（我这里没有它，我真的不记得我是如何处理某些情况的）。然而，我可以告诉你，我倾向于检查e.clientX和e.clientY坐标，如果touchend事件在touchstart目标的 50px 范围内，我无论如何都会将其映射到点击处理程序：为冷酷和颤抖的人提供一些软焦点；）所以甚至因纽特人也可以浏览页面。

无论如何，看看什么对你有用。不过有几个有用的链接：
Touch table
some history
some touch libs

于 2012-10-23T12:40:24.883 回答