限制单选按钮的点击次数并乘以数字

时间:2016-02-20 01:21:45

标签: javascript jquery html

正如您在jsfiddle中看到的,当单击#CreditCard单选按钮时,Total将乘以1.02并更新Total。

问题是可以多次点击相同的按钮,并且数字会不断增加。

我想限制点击按钮的次数为1,但也希望能够在借记卡和信用卡之间切换。 (所以当点击另一个按钮时,限制重置为0?)

非常感谢任何帮助。

https://jsfiddle.net/n52fy9am/2/

HTML

// credit card 2% surcharge
$('#CreditCard').on("click", function() {
    var totalPrice = parseFloat($('#totalPrice').text().replace(/([^0-9\\.])/g, ""));
    var surcharge = (totalPrice * 1.02).toFixed(2);
    // Update total
    $('#totalPrice').html("£" + surcharge);
});

// remove 2%
$('#DebitCard').on("click", function() {
    var totalPrice = parseFloat($('#totalPrice').text().replace(/([^0-9\\.])/g, ""));
    var surcharge = (totalPrice * 0.98).toFixed(2);
    // Update total
    $('#totalPrice').html("£" + surcharge);
});

JS

c = random.randint(0,5)
guess =int(input("="))
while True:
    if guess > c:
      print("you failed the test")
    elif guess <c: 
      print("you messed up")
    else:
      print("you are the one" + x)
      break  

3 个答案:

答案 0 :(得分:3)

只需使用旗帜即可。单击单选按钮时更改标志。这样你就可以控制是否进行计算。

此外,由于您使用toFixed(2)对其进行舍入,因此在进行计算时,数字的小数部分将会混乱。因此,使用变量来存储初始值。按下debitCard按钮时将其放回原位。

var isCreditCard = false;
var initialPrice = 154.67;
$('#totalPrice').html("£" + initialPrice.toString());

// credit card 2% surcharge
$('#CreditCard').on("click", function() {
    if (!isCreditCard) {
        var totalPrice = parseFloat($('#totalPrice').text().replace(/([^0-9\\.])/g, ""));
        var surcharge = (totalPrice * 1.02).toFixed(2);
        // Update total
        $('#totalPrice').html("£" + surcharge);

        isCreditCard = true;
    }
});

// remove 2%
$('#DebitCard').on("click", function() {
    if (isCreditCard) {
        // Update total
        $('#totalPrice').html("£" + initialPrice.toString());
        isCreditCard = false;
    }
});

答案 1 :(得分:0)

我把你的JS小提琴变成了一个堆栈片段;)

我修改了代码并在必要时放置了注释。 我存储了每次点击增加的初始计数值,如果该数字超过0则该函数被取消,这将保持为真,直到检查另一个无线电,重置之前点击的那个。

$(function() {
  // keep count of n times clicked
  var creditCardCount = 0;
  var debitCardCount = 0;
  
  // credit card 2% surcharge
  $('#CreditCard').on("change", function() {
    // if amount is greater or equal to 1 then abort the function
    if (creditCardCount > 0) {
      return false;
    }
    var totalPrice = parseFloat($('#totalPrice').text().replace(/([^0-9\\.])/g, ""));
    var surcharge = (totalPrice * 1.02).toFixed(2);
    // Update total
    $('#totalPrice').html("£" + surcharge);
    // increment credit card count
    creditCardCount++;
    // reset the other option to 0
    debitCardCount = 0;
  });

  // remove 2%
  // do the same here but for the opposite cards
  $('#DebitCard').on("change", function() {
    if (debitCardCount > 0) {
      return false;
    }
    var totalPrice = parseFloat($('#totalPrice').text().replace(/([^0-9\\.])/g, ""));
    var surcharge = (totalPrice * 0.98).toFixed(2);
    // Update total
    $('#totalPrice').html("£" + surcharge);
    debitCardCount++;
    creditCardCount = 0;
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
Total: <span id="totalPrice">£154.67</span>
<br>

<form>

  <input id="DebitCard" type="radio" name="payment" checked>
  <label for="DebitCard">Debit Card</label>
  <br>

  <input id="CreditCard" type="radio" name="payment">
  <label for="CreditCard">Credit Card (2% extra)</label>
  <br>

</form>

答案 2 :(得分:0)

我建议您简化代码。查看演示 - Fiddle

$(function() {
    var lastRadioClicked = 'DebitCard',
        canClick = true;

    $('[name="payment"]').on("click", function() {
        var surchargePercent;
        if (lastRadioClicked === this.id) {
            if (canClick) {
                if (this.id === 'DebitCard') {
                    // debit        
                    surchargePercent = 0.98;
                } else {
                    // credit    
                    surchargePercent = 1.02;
                }
                canClick = false;
                var totalPrice = parseFloat($('#totalPrice').text().replace(/([^0-9\\.])/g, ""));
                var surcharge = (totalPrice * surchargePercent).toFixed(2);
                // Update total
                $('#totalPrice').html("£" + surcharge);
            }
        } else {
            lastRadioClicked = this.id;
            canClick = true;
        }


    });
});