解决方案

Question

我在母版页中使用了bootstrap.css来生成标题内容。然后，我使用该母版页创建了一个网页（我需要使用与使用bootstrap.css文件相同的标题内容）。我想在同一页面中创建另一个内容（正文内容），但这个内容将使用jquery-mobile.css文件。但是当我在同一页面中使用这个css文件时，标题内容会根据jquery-mobile.css样式而改变（我不希望它被更改）。有没有办法将jquery-mobile.css文件应用于特定的块？

Answer 1

要了解更多内容，请阅读我的其他文章/回答： jQuery Mobile: Markup Enhancement of dynamically added content

解决方案

这可以通过几种方式完成，有时你需要将它们结合起来以达到理想的效果。

方法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")
});
```
方法2：

第二个选项是用这一行手动完成：
```
data-role="none"
```
示例：http://jsfiddle.net/Gajotres/LqDke/
方法3：

可以阻止某些HTML元素进行标记增强：
```
 $(document).bind('mobileinit',function(){
      $.mobile.page.prototype.options.keepNative = "select, input";
 });    
```
示例：http://jsfiddle.net/Gajotres/gAGtS/

在jquery-mobile.js初始化之前再次初始化它（请看下面的示例）。

结论

在您的情况下，使用解决方案1.它将阻止jQuery Mobile增强您的标题。

Answer 2

我写了一个关于类似问题的答案。

Load an external CSS for a specific DIV

我相信这可以解决你的问题。

确保验证CSS文件将始终在响应标头中返回“Access-Control-Allow-Origin”。

祝你好运！

将另一个CSS文件应用于特定的<div>块.net </div>

2 个答案:

解决方案

结论