jquery - jQuery 促销代码功能

Question

我正在使用以下代码根据输入的代码执行值更新。但它返回错误。

例如：如果促销代码是降价 10，当前总数为 100，则返回 80。应该是 90。

jQuery(document).ready(function() {
$('#promo-code').keyup(function() {
  if ($("input:text[name='promo-code']").val() == "intro") {
    var promoval = parseFloat($("input:text[name='total']").val());
    $("#total").val(promoval-10);  
  }
});

Answer 1

针对您的问题的即兴解决方案：

jQuery(document).ready(function() {

    $('#promo-code').change(function() {

        if ($(this).val() == "intro") {

           var promoval = parseFloat($("input:text[name='total']").val());
           $("#total").val(promoval-10);

        }
    }
});

Answer 2

我希望您正确设置 html，并且 keyup 功能应该可以正常工作。但是您还想检查此处其他答案中提到的其他方法。我建议你去寻找change方法。

jQuery(document).ready(function() {
$('#promo-code').keyup(function() {
  if ($("input:text[name='promo-code']").val() == "intro") {
    var promoval = parseFloat($("input:text[name='total']").val());
    $("#total").val(promoval-10);  
  }
});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input name="promo-code" type="text" id="promo-code"/>
<input name="total" type="text" value="100" id="total"/>

Answer 3

试试其他的，而不是keyup像focusout下面这样。因为当您使用keyup它时，每个 keyup 事件都会触发。

$(document).ready(function() {
  $('#promo-code').focusout(function() {
    if ($("input:text[name='promo-code']").val() == "intro") {
      var promoval = parseFloat($("input:text[name='total']").val());
      $("#total").val(promoval-10);  
    }
  });
});

检查下面的片段以供参考。

$('#total').val(100);
$('#promo-code').focusout(function() {
  if ($(this).val() == "intro") {
    var promoval = parseFloat($('#total').val());
    $("#total").val(promoval - 10);
  } else {
    alert('invalid promo');
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="promo-code">
<input type="text" id="total">