jQuery。點擊發生了什麼，然後頁面大小調整

Question

當頁面寬度低於1100px時，我需要禁用點擊。但是如果用戶決定讓它變大，那麼我需要重新啓用它。我有這個代碼，但它不起作用，如果你調整頁面大於1100px;

$(window).on('resize', function() { 
    if ($(window).width() < 1100) 
    { 
     $('.portfolio-box-caption, .portfolio-box, .popup-gallery, .container-fluid').click(function(){ 
      return false; 
     }); 
    } 
    else if ($(window).width() > 1100) 
    { 
     $('.portfolio-box-caption, .portfolio-box, .popup-gallery, .container-fluid').click(function(){ 
      return true; 
     }); 
    } 
}).resize(); 

Answer 1

您需要綁定click事件然後解除綁定。檢查加載頁面的大小將決定你開始的位置。

http://api.jquery.com/bind/的連接到選擇的列表中的功能

$("#foo").bind("click", function() { 
    alert("User clicked on 'foo.'"); 
}); 

想，他們都得到執行，這取決於觸發的事件。使用您的代碼，您將每個調整大小附加到「列表」，並且永遠不會清除它們。

Answer 2

使用的off()和on()和全局變量的布爾組合：

var clickAdded = ($(window).width() >= 1100) ? true : false, 
    w = window; 
$(window).on('resize', function() { 

    if ($(w).width() < 1100) 
    { 
     $('.portfolio-box-caption, .portfolio-box, .popup-gallery, .container-fluid').off('click'); 
     w.clickAdded = false; 
    } 
    else 
    { 
     if (!w.clickAdded) { 
      $('.portfolio-box-caption, .portfolio-box, .popup-gallery, .container-fluid').on('click', function(){ 
       w.clickAdded = true; 
       //your JS 
      }); 
     } 
    } 
}); 

，以防止多個點擊處理從加入，您需要檢查，以查看是否已經添加它（因爲resize事件還是會火如果窗口繼續放大超過1100px）