0

我需要为客户的网站创建一个“滑块”。滑块应该允许人们选择他们想要的 x 项目的数量，并显示基于此的价格。奇怪的（ish）部分是价格上涨的比例会随着商品数量的增加而下降：

  • 1 件：100 美元
  • 2 件：+90 = 190 美元
  • 3 件商品：+ 80 = 270 美元
  • 4 件商品：+ 70 = 340 美元
  • 5 件商品：+ 60 = 400 美元
  • 6 件：+ 50 = 450 美元
  • 7 件商品：+ 50 = 500 美元

从那时起所有的增加都是+50。这似乎是一个过于简单化的问题，但有谁知道我该怎么做？我几乎没有使用 JavaScript 的经验 :(

4

2 回答 2

5

看看雅虎！用户界面。他们有一个滑块小部件：http: //developer.yahoo.com/yui/slider/

以下示例应该可以帮助您入门：http: //developer.yahoo.com/yui/examples/slider/slider-ticks.html。

所有 JavaScript 框架（jQuery、MooTools）似乎都提供了一个滑块。YUI 将为您提供大量控制和加载程序，因此您不必在服务器上托管脚本。请注意，YUI 不会像我提到的其他两个那样使实现变得轻松。

这是一个 MooTools 示例：

// First example of http://demos.mootools.net/Slider

<div class="slider" id="myslider">
      <div class="knob" style="position: relative;"/>
    </div>

和 JavaScript：

var el = $('myslider'); // The slider graphic
new Slider(el, el.getElement('.knob'), {
    steps: 7,   // There are 7 choices
    range: [1, 7],  // Minimum value is 1, maximum is 7
    onChange: function(value){
        // Calculation of the value goes here
    }
});
于 2008-10-12T20:42:18.367 回答
0

虽然使用 JS 完成滑块的方法可能有无数种，但我认为计算价格的最简单方法只是在某处硬编码（或列出）它们，然后else-if:ing 通过它们。

你可以做一个算法，计算100-(i*10)前五个项目，50其余的，但未来可能比硬列出的方式更难改变。

于 2008-10-12T20:45:42.057 回答