jQuery Fortune wheel遇到了错误的结果

Question

我正在使用jQuery创建一个命运轮，并希望从旋转轮获得确切的数字

jQuery我在html

中使用它

var prices = [{
  name: '0'
}, {
  name: '1'
}, {
  name: '2'
}, {
  name: '3'
}, {
  name: '4'
}, {
  name: '5'
}, {
  name: '6'
}, {
  name: '7'
}, {
  name: '8'
}, {
  name: '9'
}, {
  name: '10'
}, {
  name: '11'
}, {
  name: '12'
}, {
  name: '13'
}, {
  name: '14'
}, {
  name: '15'
}, {
  name: '16'
}, {
  name: '17'
}, {
  name: '18'
}, {
  name: '19'
}, {
  name: '20'
}, {
  name: '21'
}, {
  name: '22'
}, {
  name: '23'
}, {
  name: '24'
}, {
  name: '25'
}, {
  name: '26'
}, {
  name: '27'
}, {
  name: '28'
}, {
  name: '29'
}, {
  name: '31'
}, {
  name: '32'
}, {
  name: '33'
}, {
  name: '34'
}, {
  name: '35'
}, {
  name: '36'
}];
$(function() {
  var $r = $('.roulette').fortune(prices);
  var clickHandler = function() {
    $('.spinner').off('click');
    $('.spinner span').hide();
    $r.spin().done(function(price) {
      $('.price').text('You have: ' + price.name);
      $('.spinner').on('click', clickHandler);
      $('.spinner span').show();
    });
  };
  $('.spinner').on('click', clickHandler);
});

我不确定我要去哪里使用此代码。每次旋转时，它都会给我不正确的结果。请我与此旋转轮背后的逻辑感到困惑。请帮助我

这是我迄今为止创建的现场示例。请指导我我该怎么做才能获得准确的结果

http://codepen.io/anon/pen/bwwvvj

Answer 1

问题是因为您的prices数组按数字顺序。它应该与轮盘轮上所示的值保持相同的顺序，例如：

var prices = [
  { name: 0 }, 
  { name: 26 }, 
  { name: 3 }
  // ...
];

更新了Codepen

还要注意，只有一个属性的对象数组非常多余。您可以改用一个整数，例如：

var prices = [0, 26, 3, 35, 12, 28, 7, 29, 18, 22, 9, 31, 14, 20, 1, 33, 16, 24, 5, 10, 23, 8, 30, 11, 36, 13, 27, 6, 34, 17, 25, 2, 21, 4, 19, 15, 32];

更新的Codepen