Question

好的所以我的页面总共有8个图像，当用户点击其中一个图像时，它会在其上方应用一个CSS圈以显示它已被选中，我通过执行以下jquery实现此目的

  $(document).ready(function () {

        $("#panel1 .row img").click(function () {
            $("#panel1 .row img").removeClass("BlackcherryCircle");
            $("#panel1 .row img").removeClass("CoconutCirle");
            $("#panel1 .row img").removeClass("MangoCircle");
            $("#panel1 .row img").removeClass("StrawberryCircle");
            $("#hdnPanel1").val('');

            var name = $(this).attr("data-name");

            var id = $(this).attr("data-id");

            switch (name) {
                case "blackcherry":
                    $(this).addClass('BlackcherryCircle');
                    break;

                case "coconut":
                    $(this).addClass('CoconutCirle');
                    break;

                case "mango":
                    $(this).addClass('MangoCircle');
                    break;

                case "strawberries":
                    $(this).addClass('StrawberryCircle');
                    break;

                default:
            }

            $("#hdnPanel1").val(id);

            getCombination();

        });
});

这在台式机和平板电脑上工作得很好，但无法在手机上触发？我错过了一些关键吗？

Answer 1

您可以将mousedown事件用于移动设备，而不是点击。运行检查以检测设备是否可移动，然后

$("#panel1 .row img").mousedown(function () { // Your code goes here });

Answer 2

您可以使用 touchstart 事件。

$("#panel1 .row img").on('click touchstart', function () {
  //Your code
});

Jquery点击功能适用于桌面，但不适用于移动设备

2 个答案: