仅应用jquery mobile 页面的一部分?

2023-12-13

我有一个示例页面,我们设计得很好。现在,我们只需要在页面的一部分中使用 jquery mobile。问题是,当我添加 jquery mobile 时,它​​弄乱了我所有的 UI 内容。有没有办法只应用 jquery mobile 页面的一部分?


有多种方法可以实现此目的,您可以在我的其他文章中找到它们ARTICLE,或者找到它HERE。搜索名为:的章节:防止标记增强的方法.

这是带有示例的简短描述。有多种解决方案,您需要选择正确的一种:

防止标记增强的方法:

这可以通过多种方式完成,有时您需要将它们结合起来才能达到预期的结果。

  • Method 1:

    它可以通过添加这个属性来做到这一点:

    data-enhance="false"
    

    到页眉、内容、页脚容器。

    这也需要在应用加载阶段进行:

    $(document).one("mobileinit", function () {
        $.mobile.ignoreContentEnabled=true;
    });
    

    在 jquery-mobile.js 初始化之前对其进行初始化(请看下面的示例)。

    有关此内容的更多信息可以在这里找到:

    http://jquerymobile.com/test/docs/pages/page-scripting.html

    例子:http://jsfiddle.net/Gajotres/UZwpj/

    要再次重新创建页面,请使用以下命令:

    $('#index').live('pagebeforeshow', function (event) {
        $.mobile.ignoreContentEnabled = false;
        $(this).attr('data-enhance','true');
        $(this).trigger("pagecreate")
    });
    
  • Method 2:

    第二个选项是使用此行手动执行此操作:

    data-role="none"
    

    例子:http://jsfiddle.net/Gajotres/LqDke/

  • Method 3:

    可以阻止某些 HTML 元素进行标记增强:

     $(document).bind('mobileinit',function(){
          $.mobile.page.prototype.options.keepNative = "select, input";
     });    
    

    例子:http://jsfiddle.net/Gajotres/jjETe/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

仅应用jquery mobile 页面的一部分? 的相关文章

随机推荐