Question

这是我的代码 这是隐藏价格来自最后一页

<input disabled="disabled" type="text" class="field" style="text-align:center;" value="<?php if(isset($_POST['TotalPrice'])){$price =mysqli_real_escape_string($con,$_POST['TotalPrice']); echo $price; } ?>" />

在此页面上，我添加了输入类型的优惠券代码

<input type="text" size = "3" name="couponadd" id="couponadd" oninput="myFunction()" class="field" placeholder="Enter Coupon Code" />

oninput设置一个函数并获取值

<script>
 function myFunction() {
   var getcoupon = $("#couponadd").val(),
      txt='Invaild Coupon';
   if (getcoupon == 'gold') {
     alert('Minus 15%');

   } else if (getcoupon == 'silver') {
     alert('Minus 10%');

   }
      **Here I want if coupon code matched do 10% or 15% from the total price on the above**
 }
</script>

Answer 1

您的代码存在多个错误。

您不应将字段设置为disabled。它应该是type="hidden" 然后我附加了一个id并获得了它的价值。在检查折扣价值后，我再次将更新后的值分配给隐藏字段。

<input type="hidden" id="total_price" class="field" style="text-align:center;" value="<?php if(isset($_POST['TotalPrice'])){$price =mysqli_real_escape_string($con,$_POST['TotalPrice']); echo $price; } ?>" />

<script>
 function myFunction() {
   var getcoupon = $("#couponadd").val();
   var total_price = $('#total_price').val();
      txt='Invaild Coupon';
   if (getcoupon == 'gold') {
     alert('Minus 15%');
     total_price = total_price - (total_price * 0.15);

   } else if (getcoupon == 'silver') {
     alert('Minus 10%');
     total_price = total_price - (total_price * 0.10);

   }
   $('#total_price').val(total_price);  // Here I am updating discounted value in the hidden field.
 }
</script>

Answer 2

您必须使用jquery特定字段输入隐藏值：

<script>
    function myFunction() {
      var getcoupon = $("#couponadd").val(),
        txt='Invaild Coupon',
        price = $('input.field:disabled).val(), //Get value from hidden input
        discount = getcoupon == 'gold' ? .15 : getcoupon === 'silver' ? .1 : 0;

      price = price * (1 - discount); // calculate price after discount
    }
</script>

Answer 3

尝试使用fowling代码：

 onload = function (){
  var e = document.getElementById('couponadd');
       e.oninput = function (){
       
     var getcoupon = $("#couponadd").val(),
      txt='Invaild Coupon';
   if (getcoupon == 'gold') {
     console.log('Minus 15%');

   }  if (getcoupon == 'silver') {
     console.log('Minus 10%');
 }
       e.onpropertychange = e.oninput; // for IE8
       e.onchange = e.oninput;
   }
      };

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<input type="text" size = "3" name="couponadd" id="couponadd"  class="field" placeholder="Enter Coupon Code" />

如何使用oninput事件

3 个答案: