Question

我有一个页面（这个实际上是http://gtsturism.agencia.ro/），其中客户端请求使用themefuse中的主题（这很难修改）。

然而，主题使用jQuery 1.8.3，我开发了一个新的部分（下面的调谐器），需要v.1.10.2才能正常运行。

问题与jQuery UI相同。我的想法是，如果我导入更新版本的jQuery，主题功能将无法工作（例如：菜单，滑块，popus等）。如果我依赖主题jQuery和jQuery ui，我的组件根本不会起作用。

我在这里的原因是因为客户从一开始就没有说明他将如何处理组件和框架要求。

我正在寻找一种不会引导我重写网站整个小部件的解决方法。

请注意，在顶部链接上调谐器现在正在工作（不是提交，而是按钮和滑块）。

感谢您的时间。

更新＃1：jQuery UI主要问题

我已经设法使一些方面工作，但主题jQuery UI经过高度修改，特别是使用这段代码启动的滑块：

var OPTIONS = {

    settings: {
      from: 1,
      to: 10,
      step: 1,
      smooth: true,
      limits: true,
      round: 0,
      format: { format: "#,##0.##" },
      value: "5;7",
      dimension: ""
    },

    className: "jslider",
    selector: ".jslider-",

    template: tmpl(
      '<span class="<%=className%>">' +
        '<table><tr><td>' +
          '<div class="<%=className%>-bg">' +
            '<i class="l"></i><i class="r"></i>' +
            '<i class="v"></i>' +
          '</div>' +

          '<div class="<%=className%>-pointer"></div>' +
          '<div class="<%=className%>-pointer <%=className%>-pointer-to"></div>' +

          '<div class="<%=className%>-label"><span><%=settings.from%></span></div>' +
          '<div class="<%=className%>-label <%=className%>-label-to"><%=settings.dimension%><span><%=settings.to%></span></div>' +

          '<div class="<%=className%>-value"><%=settings.dimension%><span></span></div>' +
          '<div class="<%=className%>-value <%=className%>-value-to"><%=settings.dimension%><span></span></div>' +

          '<div class="<%=className%>-scale"><%=scale%></div>'+

        '</td></tr></table>' +
      '</span>'
    )

  };

可在此处找到完整主题jQuery UI滑块http://jsfiddle.net/AEK8p/

所以我需要的是另一种启动我的滑块的方法，因为主题使它像这样并使用关键字滑块：

jQuery(document).ready(function() {
  // Price Range Input
  jQuery("#range_field_short_latest_price_range").slider({
    from: 90,
    to: 2490,
    smooth: true,
    scale: ["$90","$2.5k"],
    skin: "round_green",
    limits: false,
    heterogeneity: [],
    dimension: '$'
  });
});

所以我想的是在你在我的文本中看到的小提琴中将构造函数重命名为“customSlider”，但我不认为这就足够了。

UPDATE＃2：jQuery UI - 可能的解决方案 - 使用替代UI框架

所以，经过大量的努力，我找到了部分解决方案。所以我使用jQuery的不同滑块插件重写了滑块代码，你可以在这里找到http://refreshless.com/nouislider/。

这样我就避免了与主题的任何类型的冲突，我可以保留随附的Jq版本。

结论是，使用2个或更多版本的jQuery，jQuery ui或其他覆盖自己的库会有很大的痛苦，因为重叠的维度是无法控制的（就像在我修改过的主题中那样）客户从themefuse购买。

感谢大家的贡献，最终导致了这个解决方案。如果没有你的帮助，可能会花费更多的时间。

Answer 1

我重写了你的代码

$.noConflict();

jQuery(document).ready(function() {
  // Price Range Input
  jQuery("#range_field_short_latest_price_range").slider({
    from: 90,
    to: 2490,
    smooth: true,
    scale: ["$90","$2.5k"],
    skin: "round_green",
    limits: false,
    heterogeneity: [],
    dimension: '$'
  });
});

您展示的部分代码未正确对齐。

同一页面中的jQuery冲突管理

1 个答案: