jquery window.width的逻辑是什么？

Question

我创建了一个注册表单，每当我单击输入字段时，都需要响应地打开一个模态。它在移动设备上运行它的工作方式就像我想要的那样但如果我调整窗口大小没有任何反应，所以我想给你一些例子

if you open my page on mobile当你点击时，你会看到模态正在打开。

但如果您将窗口的大小调整为小于768px并且如果单击输入字段，则模式不会打开

JQUERY

var $window = $(window),
     $nogonder = $('.add-modal');

        if ($window.width() < 768) {
          $nogonder.on("click",function(){
            $("#parallaxPopup").modal('show');
          })

       }else{
        $nogonder.off("click");
        $("#parallaxPopup").modal('hide');
        $("#rezervasyonPopup").modal('hide');
        $("#popupCheckin").modal('hide');
       };

Answer 1

正如我在评论中提到的那样。目前，您的代码仅在页面加载时执行一次。为了在调整窗口大小时再次运行代码，您可以执行以下操作：

function setModal(){
  var $window = $(window),
  $nogonder = $('.add-modal');

  if ($window.width() < 768) {
      $nogonder.on("click",function(){
        $("#parallaxPopup").modal('show');
      });
   } else {
      $nogonder.off("click");
      $("#parallaxPopup").modal('hide');
      $("#rezervasyonPopup").modal('hide');
      $("#popupCheckin").modal('hide');
   }
}
setModal();
$(window).resize(setModal);