Question

我想将Jquery移动CSS和JS仅应用于某些有限的元素，而不是页面上的其他元素。我知道如何做到这一点。

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

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

由于

Answer 1

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

解决方案1：

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

<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：

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

jQuery Mobile＆lt; = 1.3.x

<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＆gt; = 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 CSS和JS有限的元素

1 个答案: