Question

我有一个问题。我有3个图像（img1，img2，img3），其中一个是透明的，另外两个图像放在透明图像的下面。 img1位于下方（如背景图像），img2位于img2上方，最后位于img3（透明图像）。我想为img2做一些动作，但触摸事件没有发生在透明图像（img3）之上。有没有办法在img2上触发触摸事件？请帮我解决这个问题.. 在此先感谢..

代码..

$('#bgTrnsImg').bind('touchend',function(e){
    $('#smallDustBean1').trigger('touchend');
});

$('#smallDustBean1').bind('click touchend',function(e){
    SpriteSheetExample1();
    alert("T1");
    // Does something special
    e.stopPropagation();
});

$('#bgTrnsImg').bind('touchend',function(e){
    $('#smallDustBean2').trigger('touchend');
});

$('#smallDustBean2').bind('click touchend',function(e){
    SpriteSheetExample2();
    alert("T2");
    // Does something special
    e.stopPropagation();
});

$('#bgTrnsImg').bind('touchend',function(e){
    $('#smallDustBean3').trigger('touchend');
});

$('#smallDustBean3').bind('click touchend',function(e){
    SpriteSheetExample3();
    alert("T3");
    // Does something special
    e.stopPropagation();
});

$('#bgTrnsImg').bind('touchend',function(e){
    $('#smallDustBean4').trigger('touchend');
});

$('#smallDustBean4').bind('click touchend',function(e){
    SpriteSheetExample4();
    alert("T4");
    // Does something special
    e.stopPropagation();
});


$('#bgTrnsImg').bind('touchend',function(e){
         $('#smallDustBean5').trigger('touchend');
    });

$('#smallDustBean5').bind('click touchend',function(e){
        SpriteSheetExample5();
        alert("T5");
        // Does something special
            e.stopPropagation();
        });

我正在更新我的代码，根据以下答案，事件触发每次触摸透明图像而不是特定的img2（smallDustBeans）。和img1 z-index是1，img2 z-index是2，img3 z-index在HTML文件中是3

Answer 1

点击和触摸事件之间存在差异。

如果您想隐式触发特定事件，请使用此类。

$('#img3').bind('touchend',function(e)
{
    $('#img2').trigger('touchend');
});

$('#img2').bind('click touchend',function(e)
{
    // Does something special
    e.stopPropagation();
});

Answer 2

您可以将jquery mobile js用于触摸事件

$("#img2").on("tap",function(){
  alert("Touched");
}

Answer 3

嗨，我终于找到了答案http://robertnyman.com/2010/03/22/css-pointer-events-to-allow-clicks-on-underlying-elements/

设置指针事件：无;在img3上，它们将起作用，因为它们对指针（和触摸）事件是不可见的。

在Jquery中触摸透明图像上的事件

3 个答案: