Jquery CSS和JS限制元素[关闭]答案

【问题标题】：Jquery CSS and JS to limited elements [closed]Jquery CSS和JS限制元素[关闭]
【发布时间】：2014-02-06 16:26:41
【问题描述】：

我只想将我的 Jquery 移动 CSS 和 JS 应用于页面上的一些有限元素，而不应用于其他元素。知道我该怎么做。

我有一些 Salesforce 标准客户门户，其中包含一个包含 Jquery、移动和 CSS 的选项卡。

现在，当我在 Customer Portal 中打开选项卡时，它会覆盖 Salesforce 标准样式。

谢谢

【问题讨论】：

什么元素？？哪一页？？什么CSS？？什么JS？？
jQM 版本，更多详情..
只需 $(selector).action() 即可。

标签： jquery jquery-mobile salesforce

【解决方案1】：

取决于您使用的 jQuery Mobile 版本。

解决方案 1：

修改mobileinit 上的全局设置，将ignoreContentEnabled 设置为true。但是，这会对应用性能产生负面影响，因为它会减慢处理/初始化小部件/元素的速度。

<head>
  <script src="jQuery.js"></script>
  <script>
    $(document).on("mobileinit", function () {
      $.mobile.ignoreContentEnabled = true;
    });
  </script>
  <script src="jQuery-Mobile.js"></script>
<head>

将 data-enhance="false" 添加到您希望 jQM 保持不变的元素或 div。

<div data-role="content" data-enhance="false">
  <!-- elements -->
</div>

<input type="text" data-enhance="false">

解决方案 2：

通过为keepNative 设置一个.selector 来修改mobileinit 上的默认页面小部件。 .selector 可以是<tag>、#id 或.class。

jQuery Mobile

<head>
  <script src="jQuery.js"></script>
  <script>
    $(document).on("mobileinit", function () {
      $.mobile.page.prototype.options.keepNative = $.mobile.page.prototype.options.keepNative + ", input, #foo, .native";
    });
  </script>
  <script src="jQuery-Mobile.js"></script>
<head>

jQuery Mobile >= 1.4.x

<head>
  <script src="jQuery.js"></script>
  <script>
    $(document).on("mobileinit", function () {
      $.mobile.keepNative = $.mobile.keepNative + ", input, #foo, .native";
    });
  </script>
  <script src="jQuery-Mobile.js"></script>
<head>

创建页面时，input、#foo ID 的元素和native 类的元素将保持原样。

Demo

【讨论】：

在您提到的示例中，我可以指定在何处使用本机样式。可以像在哪里应用 Jquery 样式一样以其他方式完成吗？谢谢
@KaushikRay 不能这样做，因为默认情况下元素会得到增强，除非你告诉 jQM 不要这样做。您可以将第一个解决方案用于完整的 div，将解决方案二用于特定元素，您也可以将这两个解决方案结合起来。