javascript - 按钮点击伪装

Question

我正在尝试让我的移动网络应用程序看起来响应更快。因此，当您单击一个图像图标时，我想在单击它时使用 jquery mobile 显示不同的图像(不同颜色)以使其看起来已经完成了某些事情，然后当您放手时它应该变回。

我正在尝试以下操作，但它似乎没有触发。有人有什么建议吗？

$( document ).ready(function() {

    $('.homeAlerts').on( "vmousedown", "a", function() {
        console.log("Clicked");
        $('#homeAlerts').attr('src','mages/HomeIcons/typeOneClicked_0003_Alerts');

    });


    $('.homeAlerts').on( "vmouseup", "a", function() {
        $('#homeAlerts').attr('src','mages/HomeIcons/typeOne_0003_Alerts.png');
    });

});

标记

   <div class="iconL">
                        <a href="#alerts" class="homeAlerts">
                            <img id="homeAlerts" src="images/HomeIcons/typeOne_0003_Alerts.png" />
                            <center class="pullup">Alerts</center>
                        </a>
                    </div>

Answer 1

改用 jquery mousedown 和 mouseup 函数:

 $("img#homeAlerts").mousedown(function(){
      $(this).attr("src", "images/HomeIcons/typeOneClicked_0003_Alerts.png")
 });
 $("img#homeAlerts").mouseup(function(){
      $(this).attr("src", "images/HomeIcons/typeOne_0003_Alerts.png")
 });