在Phonegap中的onclick事件期间更改图像

Question

在我的移动应用中，我想在用户点按图片时更改图片。 因此，使用指令时，我会在触发touchstart时向该元素添加一个类，并在触发touchend事件时将其删除。 该类仅包含：     content：url（“../ img / image_active.png”）;

这样可行，但是第一次启动应用程序时，加载新图像需要时间，因此片刻（几毫秒），当我点击图像时，我无法显示任何一个图像。 这仅在第一次附加。

我该如何解决这个问题？

Answer 1

您可以在加载应用时加载img，也可以通过javascript更改样式内容加载。

window.addEventListener('load', function(){
    if (document.images) {
        img1 = new Image();

        img1.src = "path/from/img.png";
    }
    var element = document.getElementById('element');
    element.addEventListener('touchstart',function(){
       element.style.content = 'url("'+img1.src+'")';
    },false);
    element.addEventListener('touchend',function(){
        element.style.content = '';
    },false);
},false);

我认为这会奏效。