Question

我使用jQuery mobile。在这种情况下，当屏幕宽度小于960px时，我想将数据角色可折叠添加到div。

在我的示例中，它仅在您加载网站时有效。但我希望，当我在不重新加载页面的情况下调整浏览器大小时，它也可以工作。

来自＆gt;的更改960 px到＆lt;例如，当您旋转平板电脑或手动调整浏览器窗口大小时，可以使用960像素。

$( document ).on( "pagebeforecreate", function() {
    if ($(window).width() < 960) {
       $(".medis_collaps").attr("data-role","collapsible")
    }
});

修改

.resize（）不起作用，因为我似乎必须重新加载页面才能使data-role =“collapsible”正常工作。

Answer 1

也可以使用 resize

$( window ).resize(function() {
   if ($(window).width() < 960) {
       $(".medis_collaps").attr("data-role","collapsible")
    }
});

Answer 2

您可以按如下方式绑定调整大小和加载事件：

$(window).on('resize load pagebeforecreate', function(){
    if ($(window).width() < 960) {
       $(".medis_collaps").attr("data-role","collapsible")
    }
});

在这种情况下，没有必要为任何事件绑定相同的功能。

Answer 3

您可以这样使用：

$( document ).on( "load resize pagebeforecreate", function() {
    if ($(window).width() < 960) {
       $(".medis_collaps").attr("data-role","collapsible")
    }
});

当窗口大小改变时，从div更改属性

3 个答案: