Question

这是示例数据：

100 items or less = $20
200 items or less = $15
500 items or less = $10

示例场景：用户输入150项目 - ＆gt;每件商品的价格为15

这就是我得到的： http://jsfiddle.net/ByPh5/

<script type="text/javascript">

$(function(){

var tier_prices = {
    '100':'20',
    '200':'15',
    '500':'10'
}

var user_input = $('#user_input').val();

var price_output = 0;                    
/*
   calculate
*/

    $('#price_output').text(price_output)


})

</script>

<input type="text" id="user_input" value="150"/>
<p id="price_output"></p>

非常感谢任何帮助

Answer 1

（注意：由于你留下了一些歧义，我认为500件以上的物品也需要花费20美元。）

您可以做一些更简单的事情，而不是弄乱数据结构。首先是代码，然后是解释（如果评论不够。）

function determine_price ( qty ) {
    var prices = [
        20, //0 to 99
        20, //100 to 199
        15, //200 to 299
        15, //300 to 399
        15, //400 to 499
        10  //500+
    ];

    //divide by the common denominator
    //0-99 turn into 0,
    //100-199 turns into 1
    //200-299 turns into 2
    //and so on
    qty = Math.floor( qty / 100 );

    //check for 600+, which are the same as 500 (last array item)
    return prices[ qty ] || prices.pop();
}

100,200和500有一些共同点：它们是100的倍数。所以我们采用一个数组，并将每个元素视为100的范围：第一个元素（0）是0到99个项目，第二元素（1）是100到199个项目，依此类推。然后，对于每个输入数量，我们除以该公分母，找出它落在哪个范围内，并获取与该数量相对应的价格。

在模糊性的情况下，这是600多个元素（最后一个元素，元素＃6是500-599）发生的情况，我们只是采用最后一个范围的价格。

不需要循环，只需简单的数学运算。

Answer 2

对象很好但有点烦人，因为你不能保证按顺序遍历值。

http://jsfiddle.net/radu/6MNuG/

$(function() {
    var tier_prices = {
        '100': '20',
        '200': '15',
        '500': '10'
    };

    $('#user_input').change(function() {

        var num = parseInt($(this).val(), 10),
            price = 0,
            prevTier = 0,
            maxTier = 0;            

        for (var tier in tier_prices) {
            if (tier_prices.hasOwnProperty(tier) && num <= tier) {
                if (tier < prevTier || prevTier == 0) {
                    price = tier_prices[tier];
                    prevTier = tier;
                }
            }

            if (tier > maxTier) maxTier = tier;
        }

        if (num > maxTier) price = tier_prices[maxTier];

        $('#price_output').text(price * num);
    });
});

多维数组示例：http://jsfiddle.net/radu/6MNuG/

$(function() {
    var tier_prices = [
        [100, 20],
        [200, 15],
        [500, 10]
    ];

    $('#user_input').change(function() {
        var num = parseInt($(this).val(), 10),
            price = 0,
            n = tier_prices.length - 1;

        if (num > tier_prices[n][0]) {
            price = tier_prices[n][1];   
        } else {
            for (var i = 0; i <= n; i++) {                   
                if (num <= tier_prices[i][0]) {
                    price = tier_prices[i][1];
                    break;
                }
            }
        }

        $('#price_output').text(price * num);
    });
});

Answer 3

首先，不是指定价格等级的最大数量，而是指定最小数量。并将其定义为已排序的数组，以便您可以遍历它。

var tier_prices = [
    { minQty: 0,   unitPrice: 20 },
    { minQty: 101, unitPrice: 15 },
    { minQty: 201, unitPrice: 10 }
];

然后，循环显示这些值，直到达到大于输入数量的最小数量：

var qty = +$('#user_input').val();
var price;
for (var i = 0; i < tier_prices.length && qty >= tier_prices[i].minQty; i++) {
    price = tier_prices[i].unitPrice;
}
$('#price_output').text(price * qty);

http://jsfiddle.net/gilly3/ByPh5/3/

Answer 4

尝试：

var tier_prices = {
    '100': '20',
    '200': '15',
    '500': '10'
}
var price_output = 0;
var multiplier = 1;
$('#user_input').change(function() {
    var user_input = parseInt($('#user_input').val(),10);
    for (tier in tier_prices) {
        if (user_input <= tier) {
            multiplier = tier_prices[tier];
            break;
        }
    }
    $('#price_output').text(user_input * multiplier);
});

<强> jsFiddle example

更新

这是一个放弃使用简单开关/盒子的对象的例子，因为对象的想法不是很受欢迎或功能。请注意，我添加了数量大于500的案例：

$('#user_input').change(function() {
    var user_input = parseInt($('#user_input').val(), 10);
    switch (true) {
    case user_input >= 0 && user_input <= 100:
        $('#price_output').text(user_input * 20);
        break;
    case user_input > 100 && user_input <= 200:
        $('#price_output').text(user_input * 15);
        break;
    case user_input > 200 && user_input <= 500:
        $('#price_output').text(user_input * 10);
        break;
    case user_input > 500:
        $('#price_output').text(user_input * 5);
    }
});

<强> jsFiddle example

Answer 5

正在寻找类似的东西，并决定稍微不同，在js小提琴中运行它似乎工作得很好。正如gilly3指出你可能不想要一个上限，所以你可能想做'1或更多，100或更多... 500或更多'。我使用的vars和div名称不同，但你可以看到我正在尝试做什么并根据你的需要进行调整：

JSFiddle：https://jsfiddle.net/vx4k2vdh/5/

(function() {
    const tiers = {
        0: 20,
        100: 15,
        200: 10,
        500: 5
    }

    /**
     * Take qty and return the first appropriate
     * tier that it encounters, break when
     * tier has been identified so you don't
     * waste time iterating if u've already found tier
    **/
    function calculatePriceTier(qty) {
        var selectedTier;
        for (var tier in tiers) {
          if (tiers.hasOwnProperty(tier)) {
            if (qty < tier) break;
            selectedTier = tier;
          }
        }
        return selectedTier;
     }

    $(function() {
        /**
         * Every time a new number is selected
         * run calculations and grab tier, total
        **/
        $('#items').on('input', 'input', function() {
            var qty = +$(this).val(),
                tier = calculatePriceTier(qty),
                total = qty * tiers[tier];
            $('#total-price span').text(total);
        });
    });

})();

Answer 6

在OP的请求中描述的是批量定价。此处给出的所有示例均针对批量定价而非分层定价。

红宝石中的轮胎定价示例 https://repl.it/repls/IndigoRightDisks

def cost(qty)

tier = {
    10   => 100,
    50   => 97,
    100  =>82,  
    200  =>71,
    300  =>66,
    400  =>64,
    500  =>27,
    1000 =>12
    }

  cs = []
  for cnt in 1..qty
    d = tier.keys.find{|x| cnt  <= x ?cnt <= x :  tier.keys.last == x }    
    cs << tier[d]
  end
  return cs.reduce{|y,x| y+x};
end

计算等级价格

6 个答案:

更新