javascript - Paypal 表单问题的单选按钮选择

Question

需要你的帮助

所以我有一个 paypal 表单，其中也有两个单选按钮。一种有运费，一种没有。这是实际表格的链接 http://www.topchoicedata.com/test.php

我想要发生的是，如果一个人选择了第一个单选框(“19.99 美元运费 – CD ROM 上发送的数据库”)，那么 19.99 将自动添加到设置为 175 美元的“hdwppamount”金额，所以当此人按下“立即付款”时，它将在 paypal 页面上总共赚取 194.99 美元。

如果此人选择了第二个选项(“免费送货 - 通过电子邮件发送数据库”)，那么当然没有任何值(value)添加到“hdwppamount”金额中，175 美元将是 paypal 页面的总额。

现在，如果用户选择 on 或其他选项，代码就可以正常工作，然后不会在决定他们选择哪个的单选按钮之间交替。所以它有点问题，因为如果我选择第一个选项，然后决定第二个选项，依此类推，我要么得到一个错误页面，要么如果我选择了免费选项，19.99 仍然会被添加。

我需要这样，如果选择第一个选项，则添加 19.99，如果选择第二个选项，则不添加任何内容。

如有任何帮助，我们将不胜感激。

<!--------------------HTML Form---------------------_

  <form action="PPPaymentForm/PPPaymentForm.php"  method="post" name="topchoiceform" id="topchoiceform">
    <input placeholder="Company Name" type="text" name="companyname" required>
    <input placeholder="First Name" type="text" name="first_name" required>
    <input placeholder="Last Name" type="text" name="last_name" required>
    <input placeholder="Email" type="email" name="email" id="email" required>
    <input placeholder="Address" type="text" name="address1" required>

    <input name="shipping" class="shipping" type="radio" id="shipping" checked/>
    <label class="shippingcheck">$19.99 Shipping – DATABASE SENT ON CD ROM </label>
     <br>
    <input name="shipping" class="shipping" type="radio" id="noshipping"/>
    <label class="shippingcheck">FREE SHIPPING – DATABASE SENT VIA EMAIL</label>

    <br>
    <button name="submit" type="submit" id="submit">Pay Now</button>



    <!-------------Paypal Part------------->
    <input type="hidden" name="hdwtablename" id="hdwtablename" value="1">
    <input type="hidden" name="hdwppproductname" id="hdwppproductname" value="Basic Plan 175">
    <input type="hidden" name="hdwppamount" id="hdwppamount" value="175">
    <input type="hidden" name="hdwppcurrency" id="hdwppcurrency" value="USD">
    <input type="hidden" name="hdwpplanguage" id="hdwpplanguage" value="en_US">
    <input type="hidden" name="hdwok" id="hdwok" value="http://www.topchoicedata.com/paymentmadethanks.php">
    <input type="hidden" name="hdwemail" id="hdwemail" value="mauriceflopez+gmail.com">
    <input type="hidden" name="hdwnook" id="hdwnook" value="http://">
    <input type="hidden" name="hdwactivation_email" id="hdwactivation_email" value="email">
    <input type="hidden" name="plan" id="plan" value="$175">
    <input type="hidden" name="shippingchoosen" id="shippingchoosen" value="">
    <input type="hidden" name="shippingnumber" id="shippingnumber" value="">
  </form>

PHP

<script>

$('#shipping').change(function(){

    var hdwppamount = Number($("#hdwppamount").val())

    var shippingcost = 19.99;



     if (this.checked) {

        $("#hdwppamount").val(hdwppamount+shippingcost)

     } else {

        $("#hdwppamount").val(hdwppamount-shippingcost)

     }

})

</script>

Answer 1

使用 radio ，您一次只能检查其中一个。这意味着您必须测试在指定时刻选中了哪个(即:更改事件)。

我在代码段中将输入字段 hdwppamount 从隐藏更改为文本以明确行为。

$(function () {
  $('#shipping, #noshipping').on('change', function(){
    var hdwppamount = Number($("#hdwppamount").val());
    var shippingcost = 19.99;
    if (this.id == 'noshipping') { // shipping unchecked
      $("#hdwppamount").val(hdwppamount-shippingcost);
    } else { // shipping checked
      $("#hdwppamount").val(hdwppamount+shippingcost);
    }
  });
  // initialize the field with the correct value
  $("#hdwppamount").val('194.99');
});

<script src="https://code.jquery.com/jquery-1.12.1.min.js"></script>

<form action="PPPaymentForm/PPPaymentForm.php"  method="post" name="topchoiceform" id="topchoiceform">
    <input placeholder="Company Name" type="text" name="companyname" required>
    <input placeholder="First Name" type="text" name="first_name" required>
    <input placeholder="Last Name" type="text" name="last_name" required>
    <input placeholder="Email" type="email" name="email" id="email" required>
    <input placeholder="Address" type="text" name="address1" required>

    <input name="shipping" class="shipping" type="radio" id="shipping" checked/>
    <label class="shippingcheck">$19.99 Shipping – DATABASE SENT ON CD ROM </label>
    <br>
    <input name="shipping" class="shipping" type="radio" id="noshipping" />
    <label class="shippingcheck">FREE SHIPPING – DATABASE SENT VIA EMAIL</label>

    <br>
    <button name="submit" type="submit" id="submit">Pay Now</button>



    <!-------------Paypal Part------------->
    <input type="hidden" name="hdwtablename" id="hdwtablename" value="1">
    <input type="hidden" name="hdwppproductname" id="hdwppproductname" value="Basic Plan 175">
    <input type="text" name="hdwppamount" id="hdwppamount" value="175">
    <input type="hidden" name="hdwppcurrency" id="hdwppcurrency" value="USD">
    <input type="hidden" name="hdwpplanguage" id="hdwpplanguage" value="en_US">
    <input type="hidden" name="hdwok" id="hdwok" value="http://www.topchoicedata.com/paymentmadethanks.php">
    <input type="hidden" name="hdwemail" id="hdwemail" value="mauriceflopez+gmail.com">
    <input type="hidden" name="hdwnook" id="hdwnook" value="http://">
    <input type="hidden" name="hdwactivation_email" id="hdwactivation_email" value="email">
    <input type="hidden" name="plan" id="plan" value="$175">
    <input type="hidden" name="shippingchoosen" id="shippingchoosen" value="">
    <input type="hidden" name="shippingnumber" id="shippingnumber" value="">
</form>