-1

好的，所以我有 5 个输入。金额（赌注）、机会、乘数（支付）、利润和滑块。

现在我的滑块更新了我想要它做的获胜百分比。但是，当我使用滑块更新 win % 时，它不会更新其他输入。当我使用文本输入更新获胜百分比时，它只会更新其他输入。

请参见下面的代码：

滑块 jQuery 代码：

<script type="text/javascript">
var $chance_txt = $('#chance'),
$chance_slider = $('#chanceslider').on('change', function() {
    $chance_txt.val($chance_slider.val());
});
</script>

文本输入 jQuery 代码（不要质疑公式或任何数学，它们很好）：

    <script>
    $(document).ready(function(){

        function updateValues() {
            // Grab all the value just incase they're needed.
            var chance = $('#chance').val();
            var bet = $('#bet').val();
            var pay = $('#pay').val();
            var profit = $('#profit').val();

            // Calculate the new payout.
            pay = (999/(parseFloat(chance)+0.45))*100/1000;


            // Calculate the new profit.
            profit = bet*pay-bet;
            profit = profit.toFixed(6);

            $('#chance').val(chance);
                            $('#bet').val(bet);
            $('#pay').val(pay);
            $('#profit').val(profit);
        }


        $('#chance').keyup(updateValues);
        $('#bet').keyup(updateValues);
        $('#pay').keyup(updateValues);
        $('#profit').keyup(updateValues);



    });
</script>

HTML 代码：

<label for="bet">Bet Amount</label>
    <input type="text" name="bet" id="bet" class="text" placeholder="Amount">
</div>
<div class="form-box">
<label for="pay">Multiplier </label>
<input type="text" name="pay" id="pay" class="text" placeholder="Payout - 2X Default">
</div>
<div class="form-box last">
<label for="profit">Profit </label>
<input type="text" name="profit" id="profit" class="text" placeholder="Profit">
  </div><!-- End Box -->
 <div class="clearfix"></div>
<div class="form-box">
<label for="chance">Win Chance (%)</label><input type="text" name="chance" id="chance" class="text" value="50">
</div>

<p>Slide to choose win chance or enter it in the input!</p><br><input type="range" id="chanceslider" class="vHorizon" step="0.01" min="0.01" max="98" style="background-color: #00aec8; width: 50%;">
</div>
4

2 回答 2

1

你有没有试过这个：

$chance_slider = $('#chanceslider').on('change', function() {
    $chance_txt.val($chance_slider.val());
    updateValues();
});

要么将该代码移入ready处理程序（最佳选择），要么将updateValues()声明移出ready处理程序，这样updateValues()就在范围内。

您说“不要质疑公式”，但是您确实有冗余代码-您将andupdateValues()的值检索到and变量中，但不要使用它们，而是用公式中的值覆盖它们。此外，在计算您设置的利润和他们已经拥有的值之后。此外，启用 keyup 处理程序并且当它们的用户输入的值被忽略时似乎很奇怪- 如果用户尝试键入的任何内容立即被计算值覆盖，为什么还要启用这些字段？#pay#profitpayprofit#chance#bet#pay#profit

于 2013-07-05T20:23:45.580 回答
0

You haven't called your function!

Check this fiddle.

JS:

var $chance_txt = $('#chance'),
    $chance_slider = $('#chanceslider').on('change', function () {
        $chance_txt.val($chance_slider.val());
        // Grab all the value just incase they're needed.
        var chance = $('#chance').val();
        var bet = $('#bet').val();
        var pay = $('#pay').val();
        var profit = $('#profit').val();

        // Calculate the new payout.
        pay = (999 / (parseFloat(chance) + 0.45)) * 100 / 1000;


        // Calculate the new profit.
        profit = bet * pay - bet;
        profit = profit.toFixed(6);

        $('#chance').val(chance);
        $('#bet').val(bet);
        $('#pay').val(pay);
        $('#profit').val(profit);
    });
于 2013-07-05T20:25:58.873 回答