使用PHP/MySQL值的jQuery数学计算

我想从数字中减去一个百分比，并在使用jQuery的输入中显示，但表单使用PHP/MySQL拉入值。使用PHP/MySQL值的jQuery数学计算

我使用的是选择栏额外的属性，因为该值将被回发到数据库的不同表的唯一ID，这是我有：

<input type="text" id="invamount" name="invamount" value="250.00"/> 
<select id="invdiscount"> 
    <option data-discount="0" value="" selected>No Discount</option> 
    <option data-discount="5" value="1">Discount 1 - 5%</option> 
    <option data-discount="10" value="2">Discount 2 - 10%</option> 
    <option data-discount="15" value="3">Discount 3 - 15%</option> 
</select> 
<input type="text" id="invtotal" name="invtotal" /> 

<script> 
jQuery(document).ready(function() { 
    jQuery("#invtotal").on("click", function() { 
     sum(); 
    }); 
}); 

function sum() { 
      var amount = document.getElementById('invamount').value; 
      var discount = jQuery("#invdiscount option").attr("data-discount"); 
      var maths1 = (discount * amount/100); 
      document.getElementById('invtotal').value = maths1; 
     } 
</script>

有没有在控制台错误加载窗体时，但每次我选择一个不同的打折时间，总输入的值只是停留在0

来源

2017-12-27 Adrian

你不能让PHP在选项标记中加入额外的属性吗？（如数据折扣=“”），并阅读与jQuery的价值？ – Lexib0y

好主意，让我试试吧。 – Adrian

仅供参考，您可以随时制作额外的属性，从HTML5它是官方支持的命名约定，即自定义属性应该以数据开始他们的名字 – Lexib0y

问题是您没有正确获得折扣属性。如果检查折扣变量的值下面一行执行后：

var discount = jQuery("#invdiscount option").attr("data-discount");

总是返回“0”，因为jQuery("#invdiscount option")从选择框，而不是选择一个选择所有选项。

要想从所选选项的折扣属性，你可以使用jQuery("#invdiscount option:selected").attr("data-discount")（注：选择后选项）。

另外，如果你想选择该选项后，更新的输入，你应该听听在的变化事件选择元素。

工作的代码应该是这样的：

<input type="text" id="invamount" name="invamount" value="250.00"/> 
<select id="invdiscount"> 
    <option data-discount="0" value="" selected>No Discount</option> 
    <option data-discount="5" value="1">Discount 1 - 5%</option> 
    <option data-discount="10" value="2">Discount 2 - 10%</option> 
    <option data-discount="15" value="3">Discount 3 - 15%</option> 
</select> 
<input type="text" id="invtotal" name="invtotal" /> 

<script> 
jQuery(document).ready(function() { 
    jQuery("#invdiscount").on("change", function() { 
     sum(); 
    }); 
}); 

function sum() { 
      var amount = document.getElementById('invamount').value; 
      var discount = jQuery("#invdiscount option:selected").attr("data-discount"); 
      var maths1 = (discount * amount/100); 
      document.getElementById('invtotal').value = maths1; 
     } 
</script>

最后，你可以使用jQuery方法来获取和并分配，而不是使用普通的JavaScript值。代码将如下所示：

<input type="text" id="invamount" name="invamount" value="250.00"/> 
<select id="invdiscount"> 
    <option data-discount="0" value="" selected>No Discount</option> 
    <option data-discount="5" value="1">Discount 1 - 5%</option> 
    <option data-discount="10" value="2">Discount 2 - 10%</option> 
    <option data-discount="15" value="3">Discount 3 - 15%</option> 
</select> 
<input type="text" id="invtotal" name="invtotal" /> 

<script> 
jQuery(document).ready(function() { 
    jQuery("#invdiscount").on("change", function() { 
     sum(); 
    }); 
}); 

function sum() { 
    var amount = $("#invamount").val(); 
    var discount = jQuery("#invdiscount option:selected").attr("data-discount"); 
    var maths1 = (discount * amount/100); 
    jQuery("#invtotal").val(maths1); 
} 
</script>

来源

2017-12-27 16:23:27 mgiadach

谢谢，我补充说：选择了VAR折扣，改变了监听器上。（“改变”，我也添加.toFixed（2）在结尾处显示值以强制输入2位小数，作品魅力，谢谢。 – Adrian

另一个改进可能是将选择器扩展为'$（'＃invdiscount，＃invamount'）'，因为只要金额或折扣发生更改，这将触发计算。 – cars10m

的问题是，你在每个点击输入做sum()。
而且每次选择更改时，您必须执行sum()。

jQuery(document).ready(function() { 
    jQuery("#invdiscount").on("change", function() { 
     sum(); 
    }); 
});

来源

2017-12-27 16:15:25 Roy

使用PHP/MySQL值的jQuery数学计算

回答

相关问题