我在我的母版页中使用了 bootstrap.css 来生成标题内容。然后,我使用该母版页创建了一个网页(我需要使用与 bootstrap.css 文件相同的标题内容)。我想在同一页面中创建另一个内容(正文内容),但此内容将使用 jquery-mobile.css 文件。但是当我在同一页面中使用这个 css 文件时,标题内容正在根据 jquery-mobile.css 样式更改(我不希望它被更改)。有没有办法将 jquery-mobile.css 文件应用于特定块?
2 回答
要了解更多信息,请阅读我的其他文章/答案:jQuery Mobile:动态添加内容的标记增强
解决方案
这可以通过几种方式完成,有时您需要将它们结合起来才能达到预期的结果。
方法一:
它可以通过添加这个属性来做到这一点:
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") });
方法二:
第二种选择是使用此行手动执行此操作:
data-role="none"
示例:http: //jsfiddle.net/Gajotres/LqDke/
方法三:
可以防止某些 HTML 元素进行标记增强:
$(document).bind('mobileinit',function(){ $.mobile.page.prototype.options.keepNative = "select, input"; });
示例:http: //jsfiddle.net/Gajotres/gAGtS/
在 jquery-mobile.js 初始化之前再次初始化它(看下面的例子)。
结论
在您的情况下,请使用解决方案 1。它会阻止 jQuery Mobile 增强您的标题。
我写了一个关于类似问题的答案。
我相信这应该可以解决您的问题。
确保验证 CSS 文件将始终在响应标头中返回“Access-Control-Allow-Origin”。
祝你好运!