Question

我正在尝试根据屏幕宽度为单击操作编写2个函数：

$(".view_offer_wrapper").click(function(){
    var current = $(".compare_wrapper div:last-child").index(this);
    $(".product_desc_expand").hide();
});

if ($(window).width() < 480) {
  // Different action for same click function
}

首次点击工作正常，没有任何问题。

但是如果窗口大小＆lt; 480，启动第一次点击而不是if条件内的点击功能。

Answer 1

第一个解决方案是检查点击处理程序中的条件

$(".view_offer_wrapper").click(function () {
    if ($(window).width() < 480) {
        //action 1
    } else {
        //action2
        var current = $(".compare_wrapper div:last-child").index(this);
        $(".product_desc_expand").hide();
    }
});

第二种解决方案是根据条件注册不同的点击处理程序

if ($(window).width() < 480) {
    $(".view_offer_wrapper").click(function () {
        //action 1
    });
} else {
    $(".view_offer_wrapper").click(function () {
        //action2
        var current = $(".compare_wrapper div:last-child").index(this);
        $(".product_desc_expand").hide();
    });
}

注意：如果您想支持调整窗口大小，那么您必须选择第一个解决方案

Answer 2

试试这个

$(".view_offer_wrapper").click(function(){
if ($(window).width() < 480) {
    alert('width less than 480');
   }
 else
 {
     alert('width grater than 480');
 }
});

您可以在点击功能中使用 if else 。

针对不同屏幕尺寸的不同点击操作

2 个答案: