jquery mobile，需要刷新页面才能看到更改CSS

我是JQM的新手，但不是jquery。我正在使用在正常网页上正常工作的corner.js插件。jquery mobile，需要刷新页面才能看到更改CSS

所以我在html HEAD中有以下代码。

<script type="text/javascript"> 
    $(document).ready(function() { 

     $('div.grid_inner').corner("round 8px").parent().css('padding', '4px').corner("round 14px"); 

    }); 
</script>

我有以下DIV

<div data-role="content"> 
      <div class="grid_outer" id="grid_outer_profile"> 
       <div class="grid_inner" id="grid_inner_profile"> 

        <table> 
         <tr> 
          <td><img src="<?php echo $avatarpath; ?>" /></td> 
         </tr> 
         <tr> 
          <td><?php echo $email; ?></td> 
         </tr> 
         <tr> 
          <td><?php echo $aboutme; ?></td> 
         </tr> 
        </table> 
       </div> 
      </div> 
     </div><!-- /content -->

的问题是，不应用CSS的角落。不在我的桌面，我的Android手机或Android Tab中。

只有在之后我会刷新它们的应用。我试图找出是否需要强制刷新组件，但如果是这样，我不知道如何为命名的DIV执行此操作。或者，也许我从根本上做错了什么？

感谢您的帮助！

来源

2013-03-04 Coen Damen

工作实例：http://jsfiddle.net/Gajotres/8pG6c/

文件准备是你的问题。通常它不应该与jQuery Mobile一起使用，因为它可以（并且通常会）在jQuery Mobile页面准备就绪之前触发。

可以固定一个正确jQuery Mobile页面事件，你的情况使用：

$(document).on('pagebeforeshow', '#page-id', function(){ 
    $('div.grid_inner').corner("round 8px").parent().css('padding', '4px').corner("round 14px"); 
});

page-id是显示网格你的页面的ID，在我的例子的情况下，是#index。

通常的方法是使用一个pageinit事件，但在你的情况下更好的解决方案是pagebeforeshow。 pageinit每个加载的页面只触发一次事件触发（除非手动刷新页面）。

如果你想了解更多关于这个话题，请看看我的其他ARTICLE，要更透明这是我的个人博客。或找到它HERE。

来源

2013-03-04 16:05:09 Gajotres

恭敬地不同意，每个加载的页面将调用一次“pageinit”。你用'mobileinit'混淆了它吗？ – 2013-03-04 16:15:14

您可以不同意所有您想要的内容，pageinit只会为每个加载的页面触发一次。 – Gajotres 2013-03-04 16:17:16

看起来我们同意，因为你最后一次编辑:)请注意，“每个加载页面一次”意味着每次通过AJAX获取新页面（因此不需要手动刷新）。 – 2013-03-04 16:18:53

jQuery Mobile是面向页面的并实现了自己的文档加载策略。你必须绑定到pageinit事件，而不是ready:

$(document).on("pageinit", function(e) { 
    $("div.grid_inner", e.target) 
     .corner("round 8px") 
     .parent().css("padding", "4px").corner("round 14px"); 
});

来源

2013-03-04 16:05:09

jquery mobile，需要刷新页面才能看到更改CSS

回答

相关问题