1

我有一个页面(这个实际上是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”,但我认为这还不够。

更新 #2:jQuery UI - 可能的解决方案 - 使用替代 UI 框架

所以,经过一番努力,我找到了部分解决方案。因此,我使用不同的 jQuery 滑块插件重写了滑块代码,您可以在此处找到http://refreshless.com/nouislider/

这样我就可以避免与主题发生任何类型的冲突,并且可以保留附带的 Jq 版本。

结论是,使用 2 个或更多版本的 jQuery、jQuery ui 或其他库会因为重叠的尺寸无法控制而覆盖自己,这是非常痛苦的(就像我的客户购买的这个修改过的主题一样)主题熔断器)。

感谢大家的贡献,最终导致了这个解决方案。如果没有您的帮助,这可能会更耗时。

4

1 回答 1

0

我重写了你的代码

$.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: '$'
  });
});

您显示的某些代码未正确对齐。

于 2014-01-25T05:44:15.040 回答