Javascript jQuery移动页面覆盖桌面HTML div布局_Javascript_Jquery_Html_Jquery Mobile

Javascript jQuery移动页面覆盖桌面HTML div布局

javascript jquery html jquery-mobile

Javascript jQuery移动页面覆盖桌面HTML div布局,javascript,jquery,html,jquery-mobile,Javascript,Jquery,Html,Jquery Mobile,我想在我的桌面页面上使用jQuery mobile。我可能想错了，但我尝试简单地将页面元素插入到现有的标准div中，如下所示： <body> <div id="left_sidebar"> [...] </div> <div id="mylist" data-role="page"> <div data-role="listview"> [list items bla bla] </div>

我想在我的桌面页面上使用jQuery mobile。我可能想错了，但我尝试简单地将页面元素插入到现有的标准div中，如下所示：

<body>
    <div id="left_sidebar"> [...] </div>

    <div id="mylist" data-role="page">
        <div data-role="listview"> [list items bla bla] </div>
    </div>

    <div id="right_sidebar"> [...] </div>
    <div id="site_footer"> (c) bla blub </div>
</body>


[...] 
[列表项目bla bla]
[...] 
（c） 布拉布拉布

…希望只有中间部分显示“移动”页面元素

然而，这个页面div似乎覆盖了整个站点，使所有其他div都不可见，并将整个页面变成了一个移动页面（尽管在整个屏幕上很好地显示了我的listview项目）

知道怎么办吗

非常感谢您的建议。

您永远不应该将jQuery Mobile包含在内，希望它只是页面的一部分样式。jQueryMobile非常具有侵入性，它将超过您的整个页面

对于您的问题，您有两种可能的解决方案。强制jQuery Mobile跳过部分内容，您可以找到可用的解决方案

另一方面，如果您只需要一些jQuery移动功能，您应该只使用所需的东西来重建框架，您可以这样做

好的，我似乎找到了一种方法（我不知道是否还有另一种），那就是将移动页面分开，并将其调用到iframe中

这几乎是微不足道的，但我希望有一种方法可以通过简单的div布局实现这一点

总之，这就是我的结局：

<body>
    <div id="left_sidebar"> [...] </div>

   <iframe src="JQMPage.html" frameborder="0" width="490" onload='javascript:resizeIframe(this);'></iframe>

    <div id="right_sidebar"> [...] </div>
    <div id="site_footer"> (c) bla blub </div>
</body>


[...] 
[...] 
（c） 布拉布拉布

…其中“JQMPage.html”是我单独保存的移动页面，resizeIframe函数只是根据“JQMPage.html”页面的高度调整iframe的高度，以便随着列表的扩展而扩展

不过，欢迎有更好的想法！

干杯

不要这样做，看看下面我的答案。我一定会看看jQuery移动下载生成器。如果我理解正确，我可以只使用我想要使用的单个元素，而不使用那些会覆盖整个页面的元素？事实上，我刚刚发现，如果去掉页面初始化/格式化，大部分小部件和其他功能也会自动禁用。。。我来看看你的另一个选择，通过强制跳过元素。我明白了，但这看起来要复杂得多。我唯一担心的是iFrame不能用于太多的项目，比如很多jquery移动按钮等等。。。这是很多的假设。对不起，你的解决方案看起来像是用原子弹杀死蚊子。当有其他合适的解决方案时，使用iframe是没有意义的。